HTMLDocument接口的常用属性之anchors和links

最新推荐文章于 2024-05-23 21:40:23 发布

雅痞子军

最新推荐文章于 2024-05-23 21:40:23 发布

阅读量1.2k

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/qq_1724201421/article/details/80024711

版权

JavaScript 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

HTMLDocument接口是Document接口下的一个子接口，该接口扩展了Document接口的功能，定义了属于HTML文档的属性和方法。这些属性与方法和BOM中的Document对象中的属性与方法兼容。HTMLDocument接口的属性可以获取HTML 文档中的各类对象。下面介绍下HTMLDocument接口的常用属性之anchors和links。

HTMLDocument接口的常用属性
anchors	该属性为只读属性，可以返回一个数组，数组中的元素为文档中所有锚元素。该属性只能返回包含了name属性的a元素创建的锚，而不能返回只包含id属性的a元素创建的锚。
links	该属性为只读属性，可以返回一个数组，数组中的元素为所有包含href属性的a元素和所有area元素的引用。

看下面一段代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>HTMLDocument接口的常用属性之anchors和links</title>
</head>
<body>
   <a href="https://www.baidu.com" name='a1'>链接到百度</a>
   <a href="https://www.taobao.com" id='a2'>链接到淘宝</a>
   <a href="https://www.jd.com">链接到京东</a>
    <img src="./blue.png" border="0" usemap="#map" width='100%'/>
    <map name="map">
        <area shape="rect" coords="20,20,40,40" href="https://www.baidu.com" />
        <area shape="circle" coords="80,70,20" href="https://www.taobao.com" />
        <area shape="poly" coords="280,323,323,435,100,300,287,45,34,344" href="https://www.jd.com" />
    </map>
     <script>
      alert(document.anchors.length);
      alert(document.links.length);
   </script>
</body>
</html>

运行结果如下图：