การโฟกัสองค์ประกอบการติดตาม

สมมติว่าคุณกำลังทดสอบความสามารถเข้าถึงได้ง่ายเพื่อไปยังส่วนต่างๆ ของหน้าเว็บ เมื่อไปยังส่วนต่างๆ ของหน้าเว็บด้วยแป้น Tab บางครั้งวงแหวนโฟกัสจะหายไปเนื่องจากองค์ประกอบที่มีการซ่อนโฟกัสอยู่ วิธีติดตามองค์ประกอบที่โฟกัสในเครื่องมือสำหรับนักพัฒนาเว็บ

  1. เปิดคอนโซล
  2. คลิกสร้างนิพจน์สด สร้าง Live Expression

    การสร้างนิพจน์สด

    ดูข้อมูลเพิ่มเติมได้ที่ดูค่า JavaScript แบบเรียลไทม์ด้วย Live Expression

  3. พิมพ์ document.activeElement

  4. คลิกนอก UI ของนิพจน์ทั่วไปเพื่อบันทึก

ค่าที่คุณเห็นด้านล่าง document.activeElement คือผลลัพธ์ของนิพจน์ เนื่องจากนิพจน์ดังกล่าวจะแสดงองค์ประกอบที่โฟกัสเสมอ จึงมีวิธีติดตามว่าองค์ประกอบใดที่โฟกัสอยู่

  • วางเมาส์เหนือผลลัพธ์เพื่อไฮไลต์องค์ประกอบที่โฟกัสอยู่ในวิวพอร์ต
  • คลิกขวาที่ผลลัพธ์แล้วเลือกแสดงในแผงองค์ประกอบเพื่อแสดงองค์ประกอบในแผนผัง DOM ในแผงองค์ประกอบ
  • คลิกขวาที่ผลลัพธ์แล้วเลือกจัดเก็บเป็นตัวแปรร่วมเพื่อสร้างการอ้างอิงตัวแปรไปยังโหนดที่คุณใช้ในคอนโซลได้