document.anchors和document.links

在JavaScript中，document.anchors 和 document.links 是两个不同的属性，它们都提供了对HTML文档中特定类型链接的访问，但具体用法和返回的内容有所不同。

document.anchors

document.anchors 是一个包含文档中所有带有 name 属性的 <a>（锚点）元素的集合（HTMLCollection）。这些元素通常用作页面内的导航链接，允许用户直接跳转到页面中的特定部分。

例如，如果你有以下HTML代码：

html复制代码

	<a name="section1">Section 1</a>
	<a name="section2">Section 2</a>

你可以使用 document.anchors 来访问这些元素：

javascript复制代码

	console.log(document.anchors[0].name); // 输出 "section1"
	console.log(document.anchors[1].name); // 输出 "section2"

然而，需要注意的是，在现代网页开发中，使用 name 属性来定义锚点已经不太常见了，因为这种做法可能会与全局变量名或窗口对象的属性名冲突。相反，开发者通常使用ID和CSS来创建页面内的导航链接。

document.links

document.links 是一个包含文档中所有 <a> 和 <area> 元素的集合（HTMLCollection），这些元素都表示超链接。这个集合包括了所有带有 href 属性的 <a> 元素，以及 <map> 元素中的 <area> 元素（这些元素用于图像映射）。

例如，如果你有以下HTML代码：

html复制代码

	<a href="https://example.com">External Link</a>
	<a href="#section1">Internal Link to Section 1</a>
	<map name="imagemap">
	<area shape="rect" coords="0,0,100,100" href="https://example.com/part1">
	</map>

你可以使用 document.links 来访问这些元素：

javascript复制代码

	console.log(document.links[0].href); // 输出 "https://example.com"
	console.log(document.links[1].href); // 输出 "#section1"
	// 注意：document.links 可能不包含 <area> 元素，具体取决于浏览器实现

document.links 对于遍历和修改页面上的所有链接非常有用，例如添加事件监听器或检查链接的有效性。

总结

• document.anchors 提供了对带有 name 属性的 <a> 元素的访问，这些元素通常用作页面内的导航链接。
• document.links 提供了对文档中所有 <a> 和 <area> 元素的访问，这些元素都表示超链接。