
Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Find Number of Anchors in a Document using JavaScript
This article discusses about how to find the number of anchors in a document in JavaScript. The anchor tag is a part of HTML DOM elements. The anchor property is a read only property that returns a list of anchor tags inside a document. The anchor object is represented as <a>.
There are two ways to get the length of the anchors object. One way is to use the anchors.length property that returns the number of anchor tags in a document. The other way is to use getElementByTagName method to access the anchor tag and use the length property. Both internally counts the number of <a> tags inside a document.
Syntax
The syntax to find the number of anchors in a document is shown below.
document.anchors.length or document.getElementsByTagName("a").length
Let us see the examples of these ?
Example 1
In the following example, three anchor tags were used and their length was displayed using document.anchors.length as shown in the output.
<html> <body> <a name="Tutor">Tutorix</a><br> <a name="Totorial">Tutorialspoint</a><br> <a name="Totorials">Tutorialspoint private ltd</a><br> <script> document.write(document.anchors.length); </script> </body> </html>
On executing the above code, the following output is generated.
Example 2
The following is an example program to find the number of anchors in a document.
<html> <head> <title>How to find the number of anchors in a document in JavaScript</title> </head> <h3>To find the number of anchor tags in a document</h3> <body style = "text-align:center;"> <p>The most popular websites that are used by young generation are :</p> <a href="#">Google</a> <br/> <a href="#">Facebook</a> <br/> <a href="#">Instagram</a> <br/> <p id="text1"></p> <script type="text/javascript"> document.getElementById("text1").innerHTML = "The number of anchor tags is : "+document.getElementsByTagName("a").length; </script> </body> </html>
On executing the above code, the following output is generated.
Example 3
Following is an example program to count the number of anchor tags inside a particular div tag.
<!DOCTYPE HTML> <html> <head> <title>How to find the number of anchors in a document in JavaScript</title> <head> <h3>To find the number of anchor tags in a document</h3> <body style = "text-align:center;"> <p>The most popular websites that are used by young generation are :</p> <div id="websites"> <a href="#">Google</a> <br/> <a href="#">Facebook</a> <br/> <a href="#">Instagram</a> <br/> </div> <p>The most popular cars are :</p> <div id="Cars"> <a href="#">BMW</a> <br/> <a href="#">AUDI</a> <br/> <a href="#">RANGE ROVER</a> <br/> <a href="#">MARUTI SUZUKI</a> <br/> </div> <p id="text1"></p> <script type="text/javascript"> var count = document.getElementById("Cars").getElementsByTagName("a").length; document.getElementById("text1").innerHTML = "The number of anchor tags for the mentioned div tag 'Cars' is : "+count; </script> </body> </html>
On executing the above code, the following output is generated.