
- Javascript Basics Tutorial
- Javascript - Home
- Javascript - Overview
- Javascript - Syntax
- Javascript - Enabling
- Javascript - Placement
- Javascript - Variables
- Javascript - Operators
- Javascript - If...Else
- Javascript - Switch Case
- Javascript - While Loop
- Javascript - For Loop
- Javascript - For...in
- Javascript - Loop Control
- Javascript - Functions
- Javascript - Events
- Javascript - Cookies
- Javascript - Page Redirect
- Javascript - Dialog Boxes
- Javascript - Void Keyword
- Javascript - Page Printing
- JavaScript Objects
- Javascript - Objects
- Javascript - Number
- Javascript - Boolean
- Javascript - Strings
- Javascript - Arrays
- Javascript - Date
- Javascript - Math
- Javascript - RegExp
- Javascript - HTML DOM
- JavaScript Advanced
- Javascript - Error Handling
- Javascript - Validations
- Javascript - Animation
- Javascript - Multimedia
- Javascript - Debugging
- Javascript - Image Map
- Javascript - Browsers
- JavaScript Useful Resources
- Javascript - Questions And Answers
- Javascript - Quick Guide
- Javascript - Functions
- Javascript - Resources
How to get a particular anchor in a document in JavaScript?
In this article we will learn how to get a particular anchor in a document in JavaScript.
The Javascript anchor tags follow an array-like structure. When we try to display a particular anchor tag we have to use ,document.anchors.innerHTML method. This method works the same as array methods which are used to display a particular element.
To get a better understanding let’s look into the usage and syntax of anchor tag in JavaScript.
Syntax
The syntax to get a particular anchor tag is shown below.
document.anchors[i].innerHTML or document.getElementsByTagName(“a”)[i].innerHTML
Example 1
The following is an example program to get a particular anchor tag.
<!DOCTYPE html> <html> <head> <title>To get a particular anchor in a document</title> </head> <body style="text-align : center"> <h1>To get a particular anchor in a document.</h1> <a name="google">Google</a><br> <a name="facebook">Facebook</a><br> <a name="youtube">Youtube</a><br> <p id="text1"></p> <script> document.getElementById("text1").innerHTML = "The second anchor element is : "+document.anchors[1].innerHTML; </script> </body> </html>
On executing the above code, the following output is generated.
Example 2
The another way of accessing the anchor tag content is through document.getElementsByTagName(“a”)[i].innerHTML.
<!DOCTYPE html> <html> <head> <title>To get a particular anchor in a document</title> </head> <body style="text-align : center"> <h1>To get a particular anchor in a document.</h1> <a name="google">Google</a><br> <a name="facebook">Facebook</a><br> <a name="youtube">Youtube</a><br> <p id="text1"></p> <script> document.getElementById("text1").innerHTML = "The third anchor element is : "+document.getElementByTagName("a")[2].innerHTML; </script> </body> </html>
On executing the above code, the following output is generated.
Example 3
The following is an example program to access the properties and content inside an anchor tag.
<!DOCTYPE html> <html> <head> <title>To get a particular anchor in a document</title> </head> <body style="text-align : center"> <h1>To get a particular anchor in a document.</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 third anchor element is : "+document.getElementsByTagName("a")[2].innerHTML+"<br/>"+"The name for : the third anchor element is "+document.getElementsByTagName("a")[2].getAttribute("name")+"<br/> "+"The link for the third anchor tag element is : "+document.getElementsByTagName("a")[2].getAttribute("href")+"<br/> "+"The Title for the third anchor tag element link is : "+document.getElementsByTagName("a")[2].getAttribute("title"); </script> </body> </html>
On executing the above code, the following output is generated.
- Related Articles
- How to delete particular data in a document in MongoDB?
- How to get the cookies associated with a document in JavaScript?
- How to get the number of forms in a document with JavaScript?
- How to get the entire document HTML as a string in JavaScript?
- How to reach subdata in MongoDB and display a particular document?
- How to get the title and full URL of a document in JavaScript?
- How to get embedded data in a MongoDB document?
- How to get a particular date in Java 8?
- How to find a number of anchors in a document in JavaScript?
- How to write Python regular expression to get all the anchor tags in a webpage?
- How to check if a document is ready in JavaScript?
- How to find the number of links in a document in JavaScript?
- How to find the href attribute of a link in a document in JavaScript?
- How to get a particular element from MongoDB array?
- How to get a timestamp in JavaScript?
