How to find the number of links in a document in JavaScript?

Javascript Web Development Front End Technology

In this article we are going to discuss how to find the number of links in a document in JavaScript.

The DOM property in the JavaScript provides many properties like <head>, <title>, <body>, <link>, <a>, <style>. There are two ways through which we can represent the links in HTML DOM. The DOM object provides links property.

The document.links property provides us a collection of <a> and <area> tags inside a document. The document.links property is similar to an array. We can access any property (like href, name, title) of the links using this property. To find the total number of links, the length property is used. The document.links.length gives us the total number of links in a document.

Syntax

The syntax to determine the number of links in a document is shown below.

document.links.length

Example 1

The following is an example program to find the number of links in a document.

<html>
<body>
   <a href="https://www.tutorialspoint.com/javascript/index.htm">Javascript</a><br>
   <a href="https://www.tutorialspoint.com/php/index.htm">Php</a><br>
   <a href="https://www.tutorialspoint.com/java8/index.htm">Php</a><br>
   <p id="links"></p>
   <script>
      document.getElementById("links").innerHTML = "The number of links are: " + document.links.length;
   </script>
</body>
</html>

On executing the above code, the following output is generated.

Example 2

The following is another example program to find the number of links in a document.

<!DOCTYPE html>
<html>
<head>
   <title>To find the number of links in a document in JavaScript</title>
</head>
<body style="text-align : center">
   <h1>To find the number of links in a document in JavaScript</h1>
   <a name="google" href="https://www.google.com/" title="Google Home Page">Google</a><br>
   <a name="facebook" href="https://www.facebook.com/" title="Facebook Home Page">Facebook</a><br>
   <a name="youtube" href="https://www.youtube.com/" title="Youtube Home Page">Youtube</a><br>
   <p id="text1"></p>
   <script>
      document.getElementById("text1").innerHTML = "The total number of links in the document are : "+document.links.length;
   </script>
</body>
</html>

On executing the above code, the following output is generated.

Example 3

The following example tells us about each link and count of the total number of links.

<!DOCTYPE html>
<html>
<head>
   <title>To find the number of links in a document in JavaScript</title>
</head>
<body style="text-align : center">
   <h1>To find the number of links in a document in JavaScript</h1>
   <a name="google" href="https://www.google.com/" title="Google Home Page">Google</a><br>
   <a name="youtube" href="https://www.youtube.com/" title="Youtube Home Page">Youtube</a><br>
   <p id="text1"></p>
   <script>
      var result="";
      for(var i=0;i<document.links.length;i++){
         result += "Link "+(i+1)+" : "+document.links[i].href+"<br/>";
      }
      document.getElementById("text1").innerHTML = "The links in the document are : "+'<br/>'+result+'<br/>'+"The count for total number of links is : "+document.links.length;
   </script>
</body>
</html>

On executing the above code, the following output is generated.