Posted at

XPathとCSSセレクター対応表

More than 3 years have passed since last update.

Yahoo PipesとかでXPathを使わなきゃいけないとき、CSSだとこう書くんだけどXPathでどう書いたらいいんだろう?と思って調べていたらとても良い対応表を書いている人がいたので翻訳してみた。

取得対象
CSS3
XPath

全ての要素
*
//*

全てのP要素
p
//p

全ての子要素
p > *
//p/*

ID指定
#foo
//*[@id='foo']

クラス指定
.foo
//*[contains(@class,'foo')] ※

属性指定
*[title]
//*[@title]

全てのPの最初の子要素
p > *:first-child
//p/*[0]

子要素Aを持つ全てのP
不可
//p[a]

次の要素
p + *
//p/following-sibling::*[0]

※この式はクラスが'foobar'でも'foo bar'でもマッチしてしまうので厳密には正しくありません。実際にこれらを区別しようと思ったらもっと複雑で複数の式を組み合わせる必要があるでしょう。