The DOM anchors collection is used to return the collection of all <a> elements in an HTML document. It only counts those <a> element that has the name attribute only. The name attribute of the anchor element does not support HTML 5. The elements in the collection are sorted that appear in the sourcecode.
Syntax:
document.anchors
Note: DOM anchor collection has been deprecated.
Property: The anchor collection property contains a value length that returns the number of <a> elements in the document.
Methods: The DOM anchors collection contains three methods which are given below:
- [index]: It is used to return the <a> element of the selected index. The index value starts with 0. It returns NULL if the index value is out of range.
- item(index): It is used to return the <a> element of selected index. The index value starts with 0. It returns NULL if the index value is out of range.
- namedItem(id): It is used to return the <a> element from the collection with the given id attribute. It returns NULL if the id is not valid.
Return Value: An HTMLCollection Object, representing all <a> elements in the document that have a name attribute. The elements in the collection are sorted as they appear in the source code
Example 1: In this example, we will use DOM anchors collection
HTML
<!DOCTYPE html>
<html>
<head>
<title>DOM anchors collection</title>
<style>
.gfg {
font-size: 40px;
font-weight: bold;
color: green;
}
</style>
</head>
<body>
<a name=""
class="gfg">
GeeksforGeeks
</a>
<h2>DOM anchors Collection</h2>
<a name="">
GeeksforGeeks
</a><br>
<a name="">
Sudo Placement
</a><br>
<a name="">
GFG
</a><br><br>
<button onclick="Geeks()">
Submit
</button>
<p id="sudo"></p>
<script>
function Geeks(){
let x = document.anchors.length;
document.getElementById("sudo").innerHTML =
"Number of Anchors elements: " + x;
}
</script>
</body>
</html>
|
Output:
Example 2: In this example, we will use DOM anchors collection
html
<!DOCTYPE html>
<html>
<head>
<title>DOM anchors collection</title>
<style>
.gfg {
font-size: 40px;
font-weight: bold;
color: green;
}
body {
text-align: center;
font-family: Times;
}
</style>
</head>
<body>
<a name="" class="gfg">GeeksforGeeks</a>
<h2>DOM anchors Collection</h2>
<a name="">GeeksforGeeks</a><br>
<a name="">Sudo Placement</a><br>
<a name="">GFG</a><br><br>
<button onclick="Geeks()">Submit</button>
<p id="sudo"></p>
<script>
function Geeks() {
let x = document.anchors[2].innerHTML;
document.getElementById("sudo").innerHTML =
"Second Anchor element: " + x;
}
</script>
</body>
</html>
|
Output:
Supported Browsers: The browser supported by DOM anchors collection are listed below:
- Google Chrome
- Firefox
- Opera
- Safari
Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape,
GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out -
check it out now!
Last Updated :
04 Aug, 2023
Like Article
Save Article