HTML | DOM 链接集合

HTML（Hypertext Markup Language）| DOM (Document Object Model) 是网页开发中必不可少的两个部分。HTML是一种标记语言，用于创建网页。DOM则是将HTML文档视为文档树，其中每个元素都是一个对象，使开发人员可以轻松修改和处理HTML文档。

HTML 链接标签

链接标签可以让开发人员将一个网页链接到另一个网页或文件。HTML链接标签有两种类型：文本链接和图像链接。

文本链接

文本链接使用<a>标签。下面是一个文本链接的例子：

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

属性说明

• href - 链接的URL地址
• target - 链接引用的目标窗口或框架，可选
• download - 下载链接，该属性存在时，指示浏览器下载链接，而不是在浏览器中打开它

图像链接

图像链接使用<a>和<img>标签。下面是一个图像链接的例子：

<a href="http://www.example.com">
    <img src="example.jpg" alt="Example image">
</a>

属性说明

• href - 链接的URL地址
• target - 链接引用的目标窗口或框架，可选
• alt - 图像的替代文本，如果图像无法加载，则显示该文本

DOM API

DOM是一种树形结构，其中每个节点都有其父节点和子节点。DOM API可用于访问和操作HTML页面中的元素。

获取元素

getElementById(id)是DOM API中最常用的方法之一。它根据元素的ID返回一个元素对象。例如：

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

改变元素内容

可以使用innerHTML属性更改元素的内容。例如：

let element = document.getElementById("example");
element.innerHTML = "New content";

创建新元素

可以使用createElement(tagName)方法创建新的元素。例如：

let newElement = document.createElement("p");

添加元素

可以使用appendChild(node)方法将一个新元素添加到另一个元素中。例如：

let parentElement = document.getElementById("parent");
parentElement.appendChild(newElement);

这将将新元素添加到ID为parent的元素中。

删除元素

可以使用removeChild(node)方法从DOM中删除元素。例如：

let parentElement = document.getElementById("parent");
parentElement.removeChild(childElement);

这将从parent中删除childElement。

结论

这里介绍了HTML链接标签和DOM API。HTML链接标签可以创建链接到其他网页或文件的文本和图像。DOM API可以让开发人员修改和处理HTML文档中的元素，例如获取元素、改变元素内容、创建新元素、添加元素和删除元素。HTML和DOM是网页开发中必不可少的两个部分，详细的文档见w3schools.com。