एलिमेंट फ़ोकस को ट्रैक करें

काइस बास्क
केएस बास्क

मान लीजिए कि किसी पेज के कीबोर्ड नेविगेशन की सुलभता की जांच की जा रही है. Tab बटन से पेज पर नेविगेट करने पर, कभी-कभी फ़ोकस रिंग गायब हो जाती है, क्योंकि फ़ोकस वाला एलिमेंट छिपा होता है. DevTools में फ़ोकस किए गए एलिमेंट को ट्रैक करने के लिए:

  1. कंसोल खोलें.
  2. लाइव एक्सप्रेशन बनाएं पर क्लिक करें लाइव एक्सप्रेशन बनाएं.

    लाइव एक्सप्रेशन तैयार करना.

    ज़्यादा जानकारी के लिए, लाइव एक्सप्रेशन की मदद से रीयल-टाइम में JavaScript वैल्यू देखें लेख पढ़ें.

  3. document.activeElement लिखें.

  4. सेव करने के लिए, लाइव एक्सप्रेशन यूज़र इंटरफ़ेस (यूआई) के बाहर क्लिक करें.

आपको नीचे जो वैल्यू दिख रही है document.activeElement वह एक्सप्रेशन का नतीजा है. वह एक्सप्रेशन हमेशा फ़ोकस किए गए एलिमेंट को दिखाता है. इसलिए, अब आपके पास यह ट्रैक करने का एक तरीका है कि किस एलिमेंट में फ़ोकस है.

  • व्यूपोर्ट में फ़ोकस किए गए एलिमेंट को हाइलाइट करने के लिए, नतीजे पर कर्सर घुमाएं.
  • एलिमेंट पैनल पर मौजूद DOM ट्री में एलिमेंट दिखाने के लिए, नतीजे पर दायां क्लिक करें और एलिमेंट पैनल में दिखाएं चुनें.
  • कंसोल में इस्तेमाल किए जा सकने वाले नोड के लिए वैरिएबल का रेफ़रंस बनाने के लिए, नतीजे पर दायां क्लिक करें और ग्लोबल वैरिएबल के तौर पर स्टोर करें चुनें.