Chrome Geliştirici Araçlarında XPath veya CSS seçicileri kullanarak DOM öğeleri nasıl aranır?

116

Doc http://code.google.com/chrome/devtools/docs/elements.html o XPath veya CSS seçicileri desteklediğini söyledi, ama ben çalıştım, benim için işe görünmüyordu.

Nasıl kullanılacağını bilen var mı?

dom google-chrome google-chrome-devtools

— Bobo
kaynak

Yanıtlar:

263

Sen kullanabilirsiniz $xChrome'un JavaScript konsolunda. Uzantıya gerek yok.

örn: $x("//img")

— Matt Polito
kaynak

Bu yararlı bir cevap. Buna eklemek için, $ x işlevi ikinci bir isteğe bağlı bağımsız değişken olan bağlamı kabul eder. $ x (xpath, bağlam) Bu, örneğin belirli bir iframe içeriğini seçmenize ve buna karşı bir xpath sorgusu çalıştırmanıza olanak tanır. Dolayısıyla, ilk iframe için: myframe = document.getElementsByTagName ("iframe") [0] .contentWindow.document.body; #to xpath, tablo hücreleri için iframe'i sorgulamak için: $ x ("// td", çerçevem);

— Adolph Trudeau 1812

CSS

— seçicili

Burada daha fazla komut bulunabilir: developers.google.com/chrome-developer-tools/docs/…

— Dmitry Polushkin

yaklaşık 2 yıl sonra bu soruya geri dönersek, evet bu daha güzel.

— Bobo

XPath'lerde hata ayıklamak için çok iyi! Bu arada, $x()işlev Safari komut satırı API'sinde de çalışıyor.

— Otto G

Sadece arama kutusuna xpath ifadesini yazmak işe yarayacaktır. Ağacın ucundaki yapıda benim için çalışıyor.

Özellik Chrome 11'de bozuk görünüyor, ancak bununla ilgili bir hata bildirdim : http://crbug.com/79716

— Yury Semikhatsky
kaynak

Haklısın. çalışıyor ancak vurgulama özelliği bozuk. Mac os X'te krom 10.0. * Kullanıyorum.

— Bobo

Mark Polito tarafından aşağıda daha iyi cevap.

— FGM

Chrome 32 ile çalışır. Devtool'un Element sekmesine gidin ve CTRL + S tuşlarına basın ve xpath'i arayın

— eeezyy

@eeezyy ctrl + f mi demek istiyorsun?

— Kutu

Xpath aramaları için kullanın $x('xpathSelector'). Bir css seçici kullanımı için $('cssSelector').

Ancak, bu son seçici yalnızca ilk eşleşen öğeyi döndürür. Eşleşen tüm öğeleri görmek istiyorsanız,$$('cssSelector')

— cham
kaynak