html - XPATH 式の同等の CSS セレクターが必要です

Question

私は以下のようなhtmlコードを持っています:

 <div id="select_a_boundary" class="dataset_select2">Homes name</div>

私は同じためにxpath式を書きました：

 //div[@id = 'select_a_boundary' and @class = 'dataset_select2']

同じものに相当する CSS セレクターは何ですか?

score 4 · Accepted Answer

まず、を使用している場合は、クラスを使用する必要はありません。次に、使用できるidID を持つ要素を選択する場合は、クラスを使用する必要はありません。select_a_boundary

#select_a_boundary {
   /* Styles goes here */
}

注：ここのようにそのIDとそのクラスを持つ要素を選択していません。複数の要素にIDを使用している場合、無効であるよりもIDが一意である必要があるため、IDで十分です

あなたのコメントによると

div[id=select_a_boundary][class=dataset_select2] {
    color: red;
}

または簡単なもの（クレジット：Jack）

#select_a_boundary.dataset_select2 {
    color: red;
}

注：それでも#select_a_boundary十分すぎるほど使用することをお勧めします

score 3 · Accepted Answer

CSS での式に相当するものは次のとおりです。

#select_a_boundary.dataset_select2 {
    /* whatever */
}

1 つのドキュメント内の識別子は一意である必要があるため、次のように絞り込むこともできます。

#select_a_boundary {
    /* whatever */
}

XPath セレクターと CSS セレクターには多くの類似点がありますが、2 つの異なるものであることに注意してください。

たとえば、:activeまたは:hoverに相当する XPath はありません。クラス名による適切なマッチングも、XPath ではより面倒です。

一方、CSS は、「アンカー子を持つすべての段落」のようなものを一致させることはできません//p[a]。

2 に答える 2