如何在 JavaScript 中获取文档中的特定锚点?
在本文中,我们将学习如何在 JavaScript 中获取文档中的特定锚点。
Javascript 锚点标签遵循类似数组的结构。当我们尝试显示特定的锚点标签时,我们必须使用document.anchors.innerHTML方法。此方法的工作方式与用于显示特定元素的数组方法相同。
为了更好地理解,让我们了解一下 JavaScript 中锚点标签的用法和语法。
语法
获取特定锚点标签的语法如下所示。
document.anchors[i].innerHTML or document.getElementsByTagName(“a”)[i].innerHTML
示例 1
下面是一个获取特定锚点标签的示例程序。
<!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>
执行上述代码后,将生成以下输出。
示例 2
访问锚点标签内容的另一种方法是通过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>
执行上述代码后,将生成以下输出。
示例 3
下面是一个访问锚点标签内属性和内容的示例程序。
<!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://127.0.0.1/" 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>
执行上述代码后,将生成以下输出。
广告