---
title: CSS セレクターと XPath の比較
slug: Web/XPath/Comparison_with_CSS_selectors
tags:
  - CSS
  - Draft
  - NeedsContent
  - Reference
  - XPath
  - セレクター
translation_of: Web/XPath/Comparison_with_CSS_selectors
---
<p>{{XSLTRef}}{{Page("/ja/docs/Web/XPath", "Subnav")}}{{Draft}}</p>

<p class="summary">この記事では、Web 開発者が適切な仕事に適切なツールをよりよく選択できるように、 CSS セレクタと XPath の違いを文書化して Web 開発者に提供しています。</p>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col"><a href="/ja/docs/Web/XPath">XPath 機能</a></th>
   <th scope="col"><a href="/ja/docs/Web/CSS/CSS_Selectors">相当する CSS</a></th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td><a href="/ja/docs/Web/XPath/Axes/ancestor"><code>ancestor</code></a>, <a href="/ja/docs/Web/XPath/Axes/parent"><code>parent</code></a>, <a href="/ja/docs/Web/XPath/Axes/preceding-sibling"><code>preceding-sibling</code></a> 軸</td>
   <td>{{CSSxRef(":has",":has()")}} セレクター {{experimental_inline}}</td>
  </tr>
  <tr>
   <td><a href="/ja/docs/Web/XPath/Axes/attribute"><code>attribute</code></a> 軸</td>
   <td><a href="/ja/docs/Web/CSS/Attribute_selectors">属性セレクター</a></td>
  </tr>
  <tr>
   <td><a href="/ja/docs/Web/XPath/Axes/child"><code>child</code></a> 軸</td>
   <td><a href="/ja/docs/Web/CSS/Child_selectors">子結合子</a></td>
  </tr>
  <tr>
   <td><a href="/ja/docs/Web/XPath/Axes/descendant"><code>descendant</code></a> 軸</td>
   <td><a href="/ja/docs/Web/CSS/Descendant_selectors">子孫結合子</a></td>
  </tr>
  <tr>
   <td><a href="/ja/docs/Web/XPath/Axes/following-sibling"><code>following-sibling</code></a> 軸</td>
   <td><a href="/ja/docs/Web/CSS/General_sibling_selectors">一般兄弟結合子</a>または<a href="/ja/docs/Web/CSS/Adjacent_sibling_selectors">隣接兄弟結合子</a></td>
  </tr>
  <tr>
   <td><a href="/ja/docs/Web/XPath/Axes/self"><code>self</code></a> 軸</td>
   <td>{{CSSxRef(":scope")}} または {{CSSxRef(":host")}} セレクター</td>
  </tr>
 </tbody>
</table>