การใช้ Chromes Web Inspector เพื่อดูโค้ดมีประโยชน์มาก แต่คุณจะดูตัวอย่างรหัสโฮเวอร์ของปุ่มได้อย่างไร? คุณจะต้องวางเมาส์เหนือปุ่มจึงไม่สามารถใช้ (เมาส์) ในตัวตรวจสอบได้ มีทางลัดหรือวิธีอื่น ๆ ในการดำเนินการนี้ในผู้ตรวจสอบหรือไม่?

ตอนนี้คุณสามารถดูทั้งกฎสไตล์หลอกคลาสและบังคับใช้กับองค์ประกอบต่างๆ

หากต้องการดูกฎเช่น:hoverในบานหน้าต่างสไตล์ให้คลิกปุ่มกล่องจุดเล็ก ๆ ที่ด้านบนขวา

หากต้องการบังคับให้องค์ประกอบอยู่ใน:hoverสถานะให้คลิกขวาที่องค์ประกอบนั้น

หรือคุณสามารถใช้บานหน้าต่างแถบด้านข้างของตัวรับฟังเหตุการณ์เบรกพอยต์ในแผงสคริปต์และเลือกหยุดชั่วคราวในตัวจัดการวางเมาส์

หรือคุณสามารถใช้บานหน้าต่างแถบด้านข้างของตัวรับฟังเหตุการณ์เบรกพอยต์ในแผงสคริปต์และเลือกหยุดชั่วคราวในตัวจัดการวางเมาส์

มันน่ารำคาญเล็กน้อย แต่คุณต้องคลิกขวาที่องค์ประกอบจากนั้นวางเมาส์ไว้เหนือลิงก์ใช้แป้นพิมพ์ของคุณเลือกลิงก์ 'ตรวจสอบองค์ประกอบ' แล้วกด Enter สิ่งนี้ควรแสดง css สำหรับคลาสหลอกโฮเวอร์สำหรับองค์ประกอบที่เลือก

หวังว่าพวกเขาจะทำให้สิ่งนี้ง่ายขึ้นเล็กน้อยในการสร้างในอนาคต

ใน Chrome:

คุณยังสามารถวางเมาส์เหนือองค์ประกอบแล้วคลิกCTRL+SHIFT+Cเพื่อตรวจสอบองค์ประกอบนั้น

ใน Firefox:

ใน firebug:

แหล่งที่มา: https://stackoverflow.com/a/11272205/2165415

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

โปรดดูที่ลิงค์ด้านล่างสำหรับคำตอบ

ดู: สถานะการวางเมาส์เหนือใน Chrome Developer Tools