如何在 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://#/" 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>
执行上述代码后,将生成以下输出。
广告
数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP