轻松上手,快乐学习!
HTML CSS JAVASCRIPT SQL PYTHON MYSQL PHP GIT 问答 工具 导航 更多 实例 参考

HTML DOM links 集合

实例

统计文档中有多少链接:

var x = document.links.length;

x 的结果将是:

5
亲自试一试 »

页面下方有更多实例。

定义和用法

links 链接集合返回文档中所有链接的集合。

集合中的链接表示 <a> 元素或带有 href 属性的 <area> 元素。

注释: 如果元素缺少 href 属性，则不会返回任何内容。

注释: 集合中的元素按其在源代码中的显示进行排序。

提示: 同时查看 Anchor 对象 和 Area 对象。

浏览器支持

集合
links Yes Yes Yes Yes Yes

语法

document.links

属性

属性 描述
length 返回集合中<a>或<area>元素的数量。
注释: 此属性是只读的

方法

方法 描述
[index] 返回集合中指定索引（从 0 开始）对应的 <a> and/or <area> 元素 。

注释: 如果索引号超出范围，则返回 null
item(index) 返回集合中指定索引（从 0 开始）对应的 <a> and/or <area> 元素 。

注释: 如果索引号超出范围，则返回 null
namedItem(id) 返回集合中指定索引 id 对应的 <a> and/or <area> 元素。

注释: 如果 id 不存在，则返回 null

技术细节

DOM 版本: Core Level 1 Document Object
返回值: HTMLCollection 对象，表示文档中的所有 <a> 元素或 <area> 元素。集合中的元素按其在源代码中的显示进行排序

更多实例

实例

[index]

获取文档中第一个链接（索引0）的 URL:

var x = document.links[0].href;

x 的结果将是:

https://www.begtut.com/jsref/sun.htm
亲自试一试 »

实例

item(index)

获取文档中第一个链接（索引0）的 URL:

var x = document.links.item(0).href;

x 的结果将是:

https://www.begtut.com/jsref/sun.htm
亲自试一试 »

实例

namedItem(id)

获取文档中 id="myLink" 的元素的 URL:

var x = document.links.namedItem("myLink").href;

x 的结果将是:

https://www.begtut.com/html/default.php
亲自试一试 »

实例

向文档中的第一个链接添加红色边框:

document.links[0].style.border = "5px solid red";
亲自试一试 »

实例

循环浏览文档中的所有链接，并输出每个链接的 URL（href）:

var x = document.links;
var txt = "";
var i;
for (i = 0; i < x.length; i++) {
  txt = txt + x[i].href + "<br>";
}

txt 的结果将是:

https://www.begtut.com/jsref/sun.htm
https://www.begtut.com/jsref/mercur.htm
https://www.begtut.com/jsref/venus.htm
https://www.begtut.com/html/default.php
https://www.begtut.com/css/default.php
亲自试一试 »

相关页面

JavaScript 参考手册: HTML DOM Anchor 对象

JavaScript 参考手册: HTML DOM Area 对象

HTML 教程: HTML Links

HTML 参考手册: HTML <a> 标签

HTML 参考手册: HTML <area> 标签

❮ Document 对象