Chrome डेवलपर टूल में XPath या CSS चयनकर्ताओं का उपयोग करके DOM तत्वों को कैसे खोजें?

Question

डॉक्टर http://code.google.com/chrome/devtools/docs/elements.html का कहना है कि यह XPath या CSS चयनकर्ताओं का समर्थन करता है, लेकिन जब मैंने कोशिश की, तो मेरे लिए काम नहीं किया।

किसी को पता है कि इसका उपयोग कैसे करना है?

Answer 1

आप $xक्रोम जावास्क्रिप्ट कंसोल में उपयोग कर सकते हैं । कोई एक्सटेंशन की जरूरत नहीं है।

उदाहरण के लिए: $x("//img")

Comments

यह एक सहायक उत्तर है। इसे जोड़ने के लिए, $ x फ़ंक्शन एक दूसरे वैकल्पिक तर्क, संदर्भ को स्वीकार करता है। $ x (xpath, संदर्भ) यह आपको एक विशेष iframe सामग्री का चयन करने की अनुमति देता है, उदाहरण के लिए, और इसके साथ एक xpath क्वेरी चलाएँ। तो पहले iframe के लिए: myframe = document.getElementsByTagName ("iframe" [[0] .contentWindow.document.body; # xpath क्वेरी में जो तालिका कोशिकाओं के लिए iframe है: $ x ("// td", myframe);

— एडोल्फ ट्रूडो

CSS चयनकर्ता के साथ एक तत्व को खोजने के लिए $ $ कंसोल फ़ंक्शन का उपयोग करना चाहिए, जैसे $ $ ('शरीर')

— user907860

अधिक आदेश यहां मिल सकते हैं: Developers.google.com/chrome-developer-tools/docs/…

— दिमित्री पॉलुस्किन

लगभग 2 साल बाद इस सवाल पर वापस आ रहे हैं, हाँ यह एक अच्छा है।

— Bobo

XPaths डिबगिंग के लिए बहुत अच्छा है! वैसे, $x()फ़ंक्शन सफारी कमांड लाइन एपीआई में भी काम करता है।

— ओट्टो जी

Answer 2

बस खोज बॉक्स में xpath अभिव्यक्ति टाइप करना चाहिए। यह टिप-ऑफ-ट्री बिल्ड में मेरे लिए काम करता है।

यह सुविधा क्रोम 11 में टूटी हुई प्रतीत होती है, हालांकि, मैंने इस पर एक बग दर्ज किया है: http://crbug.com/79716

Comments

तुम सही हो। यह काम कर रहा है लेकिन हाइलाइटिंग फीचर टूट गया है। मैं मैक ओएस एक्स पर क्रोम 10.0 का उपयोग कर रहा हूं। *

— बोबो

नीचे मार्क पोलिटो द्वारा बेहतर जवाब।

— FGM

यह Chrome 32 के साथ काम करता है। devtool के एलीमेंट टैब पर जाएं और CTRL + S दबाएँ और xpath के लिए खोजें

— eeezyy

@eeeyy से आपका मतलब है ctrl + f?

— बॉक्स

Answer 3

Xpath खोजों के लिए उपयोग करें $x('xpathSelector')। एक css चयनकर्ता उपयोग के लिए $('cssSelector')।

हालाँकि, यह अंतिम चयनकर्ता केवल पहला मिलान तत्व देता है। यदि आप सभी मिलान तत्वों को देखना चाहते हैं$$('cssSelector')