如何在 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