Webをキャプチャして変換するツール

GrabzItでCSSセレクターを使用する

CSSセレクターは、ターゲット要素で使用され、要素を非表示にし、要素機能が1つ以上のHTML要素を識別するのを待ちます。 CSSセレクターの2つの主なタイプは、IDまたはクラスで選択することです。 以下に示すようにid属性が含まれている場合、HTML要素にはidがあります。

<span id="myidentifier">Example Text</span>

それを選択するには、次のようなCSSセレクターを作成します #myidentifier

HTML要素にクラスがある場合、この例に示すように、クラス属性があります。

<div>
<span class="myclass">Example Text One</span>
<span class="myclass">Example Text Two</span>
<span class="myclass">Example Text Three</span>
</div>

それを選択するには、次のようなCSSセレクターを作成します .myclass

クラスの特定の要素を選択したい場合 myclass この場合、標準のCSSセレクターを使用してそうすることができます n番目の子(2) そのようなセレクター: .myclass:nth-child(2) 2番目のmyclassスパンを選択します。 ただし、親div要素の下には他の要素がないため、これはこの場合にのみ機能します。 たとえば、ap要素がある場合、n番目の子のインデックスが変更されます。

複数の一致する要素の処理

CSSセレクターから複数のHTML要素が返され、ターゲット要素を使用している場合、または要素機能を待機している場合、最初に一致した要素のみが使用されます。 ただし、要素の非表示機能を使用している場合、一致するHTML要素はすべて非表示になります。

異なるIDまたはクラスを持つ複数の要素を非表示にしたい場合は、各CSSセレクターをコンマで区切ることでできます。 したがって、たとえば、上記の例のクラスとIDを非表示にするには、次を使用します #myidentifier,.myclass