参考资料

  1. HTML DOM shift键被按下了吗?
  2. HTML DOM 返回一个区域的href属性的querystring部分 实例
  3. HTML DOM为表格创建一个标题
  4. HTML DOM 返回图像映射的某个区域的href 实例
  5. HTML DOM 返回一个链接的type属性的值实例
  6. HTML DOM 节点列表
  7. HTML DOM 属性
  8. HTML DOM 返回当前的文件和链接的文档之间的关系

HTML DOM 锚点名称返回实例

详细介绍

HTML DOM中的锚点名称可以通过name属性获取或设置。锚点(<a>)元素的name属性用于指定文档中可链接到的位置名称。

标签

<a name="section1"></a>

<a id="section1"></a>

用法

获取锚点名称:

var anchorName = document.getElementById("myAnchor").name;

设置锚点名称:

document.getElementById("myAnchor").name = "newName";

实例

<a name="top"></a>
<h1>页面标题</h1>
<p>页面内容...</p>
<a href="#top">返回顶部</a>

<script>
  var topAnchor = document.getElementsByName("top")[0];
  console.log(topAnchor.name); // 输出: top
</script>

功能

  1. 创建文档内部导航点

  2. 允许页面内跳转

  3. 可通过JavaScript动态修改

CSS扩展

可以样式化锚点:

a[name] {
  display: block;
  height: 0;
  overflow: hidden;
}

a[name="top"] + h1 {
  color: blue;
}

注意:现代HTML5推荐使用id属性代替name属性来定义文档片段标识符。