+ +
ビューポート幅
DOM 深度
Chrome 拡張機能

高精度 XPath
セレクターツール

|

ワンジェスチャーで XPath セレクターを生成、検証、コピー。Shift+ホバーで任意の要素を指定。DOM ツリーで考える開発者と QA エンジニアのために。

ステータス 無料・オープンソース
プライバシー データ収集なし
導入 1分以内で導入完了
//nav

機能アノテーション

モダンな Web 要素検査と XPath 生成のための精密設計された 6 つの機能。

+

Shift + ホバー

Shift を押しながらカーソルを移動。ポインター下の任意の要素に対して XPath セレクターが即座に生成されます。

</>

リアルタイム編集

セレクターをリアルタイムで修正。一致する要素がページ上で即座にハイライトされます。

#

複数セレクター

すべての要素に対して複数の代替 XPath 式を取得。最も堅牢なオプションを選択できます。

○

テーマ切替

ライトとダークのインターフェーステーマを切り替え。作業環境に適応します。

A

セットアップ不要

インストールして Shift を押すだけで調査を開始できます。アカウント登録も初期設定も外部依存も不要です。

⇒

クリップボードコピー

ワンクリックでクリップボードにコピー。テストスクリプトやブラウザコンソールに直接貼り付け。

ライブ回路図

インスペクターが DOM 要素をスキャンする際の XPath 生成をリアルタイムで観察。

XPath インスペクター — ライブプレビュー スキャン中
ソースドキュメント
<div class="app">
  <nav id="main-nav">
    <ul class="nav-list">
      <li><a href="/docs">Docs</a></li>
      <li><a href="/api">API</a></li>
    </ul>
  </nav>
</div>
生成結果
プライマリセレクター
//nav[@id='main-nav']//a[@href='/docs']
代替案
//ul[@class='nav-list']/li[1]/a
//a[contains(text(),'Docs')]
Shift を押しながら任意の要素にホバーすると XPath が即座に生成されます。セレクターをライブ編集し、一致のハイライトを確認できます。
React
TypeScript
Vite
Chrome API
i18next

技術仕様

インストール前に知っておくべきすべて。一つの拡張機能、設定不要。

XPath Tools

Chrome 拡張機能 — インストールガイド
種類 Chrome ブラウザ拡張機能
プラットフォーム Chromium ベースのブラウザ
フレームワーク React + TypeScript + Vite
バージョン 0.7.0
更新日 2026年3月28日
サイズ 624KiB
言語 英語(米国)
有効化 任意の DOM 要素上で Shift + ホバー
価格 無料&オープンソース
プライバシー データ収集なし · オフライン動作
インストール 1. Chrome ウェブストアを開く → 2. Chrome に追加 → 3. Shift+ホバー
Chrome にインストール