Property document.links คืนค่า HTMLCollection ของ Element ทั้งหมดที่มี href Attribute ได้แก่ <a> และ <area> ใช้ .length เพื่อนับจำนวน
ตัวอย่างโค้ด
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Example</title>
</head>
<body>
<p>
<a href="/java/index.htm">Java</a><br>
<a href="/php/index.htm">PHP</a><br>
<a href="/ruby/index.htm">Ruby</a><br>
<a href="/wordpress/index.htm">WordPress</a>
</p>
<script>
var num = document.links.length;
document.write("How many links? " + num);
</script>
</body>
</html>
คำอธิบาย
document.links— Live HTMLCollection ของ<a href>และ<area href>.length— จำนวนลิงก์ทั้งหมด- ผลลัพธ์:
How many links? 4 - เข้าถึงลิงก์ตัวที่ n:
document.links[n](0-indexed)
การใช้งานจริง
- นับ/วนลูปลิงก์ทั้งหน้า:
Array.from(document.links).forEach(...) - เพิ่ม Event Listener ให้ลิงก์ทั้งหมด (Event Delegation ดีกว่า)
- Validate/Modify href แบบ Dynamic
- External Link Detection:
link.hostname !== location.hostname
ตัวเลือกสมัยใหม่: document.querySelectorAll('a[href], area[href]') คืนค่า NodeList (Static) ใช้งานยืดหยุ่นกว่า
