HTML DOM Anchor 对象

在 HTML 网页中，超链接是连接一个文档到另一个文档的最常见方式，超链接由 <a> 元素定义。在 HTML DOM 中，超链接由 Anchor 对象 定义。

Anchor 对象表示 HTML 页面中的超链接，它是 Document 对象的一部分。它通过文档中的超链接 <a> 元素创建，可以用来读取和修改超链接的 URL 和其他属性。

创建 Anchor 对象

在 JavaScript 中，可以使用 document.createElement() 方法来创建一个新的 <a> 元素。这个方法可以生成一个具有指定属性和值的新元素。

let newLink = document.createElement("a");
newLink.href = "http://www.example.com";
newLink.innerHTML = "Example Website";

上面的代码可以创建一个新的超链接元素，并设置它的 href 和 innerHTML 属性。

可以使用 document.getElementById() 方法获取一个页面中存在的 <a> 元素，并将其作为 Anchor 对象使用。

<a href="http://www.example.com" id="example">Example Website</a>

let exampleLink = document.getElementById("example");

上述代码会从文档中获取带有 id 属性的元素，并将其赋值给 exampleLink 变量。exampleLink 变量现在表示了页面上的这个超链接对象。

Anchor 对象有一系列属性，可以用来读取和设置超链接的信息。下面列出了常用的几个属性。

href 属性表示超链接的 URL。可以通过这个属性将页面中的超链接指向任何其他网页。

exampleLink.href = "http://www.example2.com";

上述代码会将 exampleLink 链接到指定的新网址。

target 属性仅在超链接用于在新浏览器窗口或标签页中打开时使用。设置这个属性可以在用户单击链接时打开新窗口或标签。

exampleLink.target = "_blank";

_blank 值表示在新浏览器窗口或标签页中打开，而 _self 表示在当前窗口或标签页中打开。

title 属性用于创建一个鼠标悬停提示，在鼠标移到链接上时，会在浏览器中显示一个工具提示。

exampleLink.title = "这是一个示例链接";

设置 title 属性后，当用户将鼠标移到链接的上方时，浏览器将会显示一个包含指定文本的标题。

Anchor 对象还有一些方法，可以用来操作超链接。下面列出了常用的方法。

click() 方法用于模拟用户单击链接的操作。

exampleLink.click();

上述代码调用 click() 方法，会模拟用户单击了页面中的 exampleLink 超链接。这将会打开链接的目标网址。

Anchor 对象是 HTML DOM 的一部分，表示 HTML 网页中的超链接。使用 JavaScript，可以读取和修改超链接的属性和方法，以便改变超链接指向的目标，或者模拟用户单击该链接。当编写 JavaScript 以控制超链接时，Anchor 对象是一个非常有用的工具。