数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装学
法学如何在 JavaScript 中获取链接的 hreflang 属性值？
在本教程中，我们将学习如何在 JavaScript 中获取链接的 hreflang 属性值。
hreflang 是链接或锚标记的一个属性，它指定链接文档或 href 属性的语言。
搜索引擎使用它来理解链接的语言和网站的目标地理位置。为了更好的 SEO，必须使用 hreflang 属性。
单个语言或语言和区域的组合用作 hreflang 属性的值。它使用语言代码 ISO-639-1 和区域代码 ISO-3166-1。
例如：如果 hreflang 属性值为“en−us”，则该链接为英语，目标为美国。“x−default”用于不专门针对特定区域或语言的默认链接。
使用 document.getElementById() 方法
document.getElementById() 方法可用于获取链接或锚标记的 hreflang 属性值。它在参数中获取锚标记的 id，并返回该锚标记的元素对象，然后我们可以使用键“hreflang”从该对象中获取 hreflang 的值。
用户可以按照以下语法获取链接的 hreflang 值。
语法
document.getElementById('mylink').hreflang
在上述语法中，“mylink”是锚标记的 id，通过使用 document.getElementById 方法和 hreflang 键，我们获取 hreflang 属性值。
示例
在下面的示例中，我们使用了 document.getElementById() 方法来获取链接的 hreflang 属性值。
<html> <body> <h4>Get the value of the hreflang attribute of a link in JavaScript using <i>document.getElementById()</i> method</h4> <div> <a id="link1" href="https://tutorialspoint.com/" hreflang="en">Link 1</a><br> <a id="link2" href="https://tutorialspoint.com/" hreflang="en-us">Link 2</a> </div> <br/> <div id = "root"> </div> <script> // accessing all hreflang value from all links let hreflang1=document.getElementById('link1').hreflang let hreflang2=document.getElementById('link2').hreflang let root = document.getElementById('root') root.innerHTML='Link 1 hreflang: '+hreflang1+'<br>' root.innerHTML+='Link 2 hreflang: '+hreflang2+'<br>' </script> </body> </html>
在上面的输出中，用户可以看到，使用 document.getElementById 方法，我们可以获取不同链接的 hreflang 属性值。
使用 document.getElementsByTagName() 方法
在 JavaScript 中，document.getElementsByTagName() 方法也可用于获取链接或锚标记的 hreflang 属性值。它在参数中获取标记名称，并返回一个 HTMLCollection，类似于列表或数组。它包含该标记名称的所有元素对象，并且我们可以使用键“hreflang”从每个对象中获取 hreflang 的值。
语法
// getting all anchor tags
let links = document.getElementsByTagName('a')
// looping through all the HTMLCollection links
for (let index = 0; index < links.length; index++) {
let link = links[index] // accessing each anchor tag element
let hreflang = link.hreflang // accessing the hreflang value
console.log(hreflang)
}
在上述语法中，document.getElementByTagName() 方法将“a”作为参数，因此它返回所有元素（HTMLCollection 中的锚标记），并通过循环遍历它，我们获取所有链接的所有 hreflang 属性值。
示例
在下面的示例中，我们使用了 document.getElementByTagName() 方法来获取链接的 hreflang 属性值。
<html> <body> <h4>Get the value of the hreflang attribute of a link in JavaScript using <i>document.getElementsByTagName()</i> method</h4> <div> <a id="link1" href="https://tutorialspoint.com/" hreflang="en">Link 1</a><br> <a id="link2" href="https://tutorialspoint.com/" hreflang="en-us">Link 2</a> </div> <br /> <div id="root"></div> <script> let root=document.getElementById('root') let links=document.getElementsByTagName('a') for (let index=0; index < links.length; index++) { let link = links[index] let hreflang = link.hreflang root.innerHTML +='Link '+ (index+1) +' hreflang: '+hreflang+'<br>' } </script> </body> </html>
在上面的输出中，用户可以看到，使用 document.getElementByTagName() 方法，我们可以获取不同链接的 hreflang 属性值。
使用 document.querySelectorAll() 方法
在 JavaScript 中，document.querySelectorAll() 方法也可用于获取链接或锚标记的 hreflang 属性值。它在参数中获取标记名称和 CSS 选择器，并返回一个 NodeList，类似于列表或数组。它包含该标记名称的所有元素作为节点元素对象，并且我们可以使用键“hreflang”从每个对象中获取 hreflang 的值。
使用 document.querySelectorAll()，我们可以获取所有具有 hreflang 属性的锚标记。在 document.getElementByTagName() 方法中，我们获取所有锚标记，无论它是否具有 hreflang 属性。
语法
// getting all anchor tags that have hreflang attribute
let links = document.querySelectorAll('a[hreflang]')
在上述语法中，document.querySelectorAll() 方法将“a[hreflang]”作为参数，因此它返回所有元素（NodeList 中包含 hreflang 属性的锚标记），并通过循环遍历它，我们获取所有链接的所有 hreflang 属性值。
示例
在下面的示例中，我们使用了 document.querySelectorAll() 方法来获取链接的 hreflang 属性值。
<html> <body> <h4>Get the value of the hreflang attribute of a link in JavaScript using <i>document.querySelectorAll()</i> method</h4> <div> <a id="link1" href="https://tutorialspoint.com/" hreflang="en" > Link 1 </a><br> <a id="link2" href="https://tutorialspoint.com/" hreflang="en-us"> Link 2 </a><br> <a id="link3" href="https://tutorialspoint.com/">Link 3(no hreflang)</a> </div> <br /> <div id = "root"> </div> <script> let root = document.getElementById('root') let links = document.querySelectorAll('a[hreflang]') for (let index=0; index < links.length; index++) { let hreflang = links[index].hreflang root.innerHTML += 'Link ' + (index + 1) +' hreflang: '+hreflang+'<br>' } </script> </body> </html>
在上面的输出中，使用 document.querySelectorAll 方法，我们可以获取所有具有 hreflang 属性的链接的 hreflang 属性值。
浏览量：753
