CodeKitHubApakah alat ini?
XPath (XML Path Language) ialah piawaian W3C untuk menavigasi dan memilih nod — elemen, atribut, teks — di dalam dokumen XML menggunakan sintaks laluan yang padat, contohnya `//book[price>30]/title` memilih setiap `<title>` yang elemen `<price>` sebelahnya lebih besar daripada 30, di mana-mana sahaja dalam dokumen. Ia digunakan oleh helaian gaya XSLT, alat pengesahan XML, pengikis web, rangka kerja automasi pelayar (Selenium, Playwright) dan banyak pustaka XML bahasa pengaturcaraan.
Versi semasa yang dilaksanakan oleh setiap pelayar utama — Chrome, Firefox, Safari, Edge — ialah XPath 1.0, Cadangan W3C asal 1999. Alat ini menggunakan enjin natif yang sama persis melalui API `document.evaluate()` pelayar, jadi hasil di sini sepadan dengan apa yang anda perolehi daripada DevTools pelayar atau mana-mana JavaScript yang berjalan dalam pelayar. Ia tidak melaksanakan spesifikasi XPath 2.0/3.0/3.1 yang lebih baharu (yang menambah fungsi seperti `for`, jujukan, dan padanan regex) — lihat Soalan Lazim untuk apa maksudnya secara praktikal.
Ungkapan boleh mengembalikan salah satu daripada dua jenis hasil: set nod (sifar atau lebih elemen, atribut atau nod teks yang sepadan, yang mana alat ini bersirikan dan menyenaraikan satu setiap baris berserta bilangan), atau nilai skalar — nombor, rentetan atau boolean — apabila ungkapan itu sendiri mengira nilai, seperti `count(//book)` atau `//book[1]/title = 'Dune'`.
Kenapa guna alat ini?
- Nyahpepijat ungkapan XPath sebelum mengekod kerasnya ke dalam pengikis web, ujian Selenium/Playwright, atau helaian gaya XSLT.
- Semak dengan cepat sama ada XPath tertentu memilih nod yang anda jangkakan daripada sampel XML/HTML sebenar.
- Lihat bilangan padanan tepat dan output bersiri, bukannya meneka daripada kod.
- Dapatkan ralat yang segera dan boleh dibaca untuk XML yang tidak terbentuk dengan baik atau sintaks XPath yang tidak sah, bukannya jejak tindanan yang sukar difahami.
- 100% di sisi klien: XML dan ungkapan anda tidak pernah meninggalkan pelayar anda.
Cara menggunakannya
- Tampal atau edit XML (atau HTML) anda dalam kotak input — dokumen sampel kedai buku telah diisi lebih dahulu supaya anda boleh melihatnya berfungsi dengan segera.
- Taip ungkapan XPath dalam medan ungkapan, atau edit contoh yang telah diisi lebih dahulu.
- Klik "Evaluate" (atau tekan Enter dalam medan ungkapan).
- Baca nod yang sepadan di bawah, dengan bilangan di bahagian atas; hasil skalar (nombor, rentetan, boolean) dipaparkan secara terus.
- Jika XML atau ungkapan tidak sah, mesej ralat khusus akan menggantikan hasil.
Contoh
Input
XML:
<bookstore>
<book><title>The Great Gatsby</title><price>12.99</price></book>
<book><title>Learning XPath</title><price>34.50</price></book>
<book><title>Dune</title><price>45.00</price></book>
</bookstore>
XPath: //book[price>30]/titleHasil
✓ 2 node(s) matched
<title>Learning XPath</title>
<title>Dune</title>Hanya 2 daripada 3 buku mempunyai harga melebihi 30, jadi tepat 2 elemen <title> dikembalikan — buku ketiga (Gatsby, $12.99) betul-betul dikecualikan.
XPath berbanding pemilih CSS secara ringkas
Kedua-dua bahasa memilih nod daripada dokumen, tetapi mereka menyelesaikan masalah yang berbeza. Gunakan jadual ini untuk memilih alat yang betul bagi pemilihan tertentu.
| Keupayaan | XPath | Pemilih CSS |
|---|---|---|
| Pilih mengikut tag/kelas/id ke bawah | Ya | Ya — dan biasanya lebih pantas |
| Pilih mengikut kandungan yang kelihatan/teks | Ya — `contains(text(),'x')` | Tidak |
| Merentas ke atas ke induk/moyang | Ya — `//div[span]/..` | Tidak (`:has()` ialah pengecualian separa yang lebih baharu) |
| Perbandingan nilai adik-beradik (cth. `price>30`) | Ya | Tidak |
| Berfungsi di luar pelayar (alat XML sisi pelayan, XSLT) | Ya | Tidak — pemilih CSS khusus untuk pelayar/DOM |
Alat berkaitan
Bekerja dengan format data berstruktur? Alat ini sesuai digunakan bersama pengujian XPath.
Soalan lazim
Untuk apakah XPath digunakan?
XPath memilih nod — elemen, atribut, atau teks — daripada dokumen XML atau HTML menggunakan sintaks laluan. Ia adalah bahasa pemilihan di sebalik transformasi XSLT, banyak pengesah XML, dan ia digunakan secara meluas dalam pengikisan web dan automasi ujian pelayar (Selenium, Playwright, Cypress) untuk mencari elemen pada halaman, terutamanya apabila pemilih CSS sahaja tidak dapat menyatakan syarat yang diperlukan.
XPath berbanding pemilih CSS — yang mana patut saya gunakan?
Kedua-duanya bertindih tetapi tidak setara. XPath boleh memilih induk berdasarkan kandungan anaknya (`//div[span='Total']`), merentas ke atas ke moyang, dan memilih berdasarkan teks yang kelihatan (`//button[contains(text(),'Submit')]`) — pemilih CSS tidak boleh bergerak ke atas dalam pokok dan langsung tidak boleh memadankan berdasarkan kandungan teks. Jika anda hanya memilih berdasarkan tag, kelas atau ID ke bawah melalui dokumen, pemilih CSS lebih mudah ditulis dan biasanya lebih pantas dinilai. Gunakan XPath khususnya apabila anda memerlukan "pilih induk teks ini" atau "pilih berdasarkan apa yang dikatakan elemen", bukan sekadar apa tag atau kelasnya.
Adakah alat ini menyokong fungsi XPath 2.0 atau 3.0?
Tidak — begitu juga tiada pelayar. Pelayar melaksanakan XPath 1.0 (Cadangan W3C 1999) melalui `document.evaluate()`, dan alat ini menggunakan enjin natif yang sama persis, jadi ia tepat dengan apa yang anda perolehi apabila menjalankan ungkapan yang sama dalam DevTools pelayar atau JavaScript. Fungsi dan ciri yang diperkenalkan dalam XPath 2.0/3.0/3.1 (seperti ungkapan `for`, jujukan, atau `matches()` dengan regex) tidak tersedia — hanya fungsi 1.0 seperti `contains()`, `starts-with()`, `substring()`, `count()`, `position()` dan `last()` berfungsi di sini.
Apakah beberapa ungkapan XPath biasa yang perlu saya ketahui?
`//tag` memilih setiap `<tag>` di mana-mana sahaja dalam dokumen. `//tag[@attr='value']` memilih elemen `<tag>` yang atribut `attr`-nya sama dengan `value`. `//tag[contains(text(),'x')]` memilih elemen `<tag>` yang teks langsungnya mengandungi `x`. `//tag[1]` memilih elemen adik-beradik `<tag>` pertama dalam setiap induk. `//parent/child` memilih elemen `<child>` yang merupakan anak langsung `<parent>`. `count(//tag)` mengembalikan nombor dan bukannya set nod.
Adakah alat ini mengendalikan ruang nama XML?
Hanya kes biasa tanpa ruang nama disokong dengan bersih, yang meliputi majoriti besar XML/HTML yang ditulis secara manual atau dikikis. Jika dokumen anda mengisytiharkan ruang nama XML (contohnya, `xmlns="..."` pada elemen akar), `document.evaluate` memerlukan fungsi resolver yang sedar ruang nama untuk memetakan awalan kepada URI, yang mana alat mudah ini tidak menyediakannya — ungkapan terhadap XML berruang nama mungkin mengembalikan sifar padanan walaupun kelihatan betul. Ini adalah had yang diketahui, bukan pepijat: keluarkan pengisytiharan ruang nama daripada sampel anda, atau gunakan fungsi local-name() sebagai jalan penyelesaian (contohnya, `//*[local-name()='title']`).
Adakah XML atau ungkapan XPath saya dihantar ke pelayan?
Tidak. Semuanya berjalan secara tempatan menggunakan `DOMParser` dan `document.evaluate()` terbina dalam pelayar anda — enjin yang sama yang pelayar anda sudah gunakan secara dalaman. Tiada apa yang anda taip atau tampal akan meninggalkan peranti anda.