参考资料

1. HTML DOM 改变链接的target属性实例
2. HTML DOM 当点击完button不可用 实例
3. HTML DOM 修改
4. HTML DOM 返回和设置链接的href属性实例
5. HTML DOM改变下拉列表中被选中的选项的文本
6. HTML DOM 返回一个iframe中的longdesc属性的值
7. HTML DOM 返回一个区域的href属性的querystring部分 实例
8. HTML DOM获得有下拉列表的表单的ID

HTML DOM 图像映射区域 pathname 属性

介绍

pathname 属性返回图像映射中某个区域的路径部分（即 URL 中域名之后的部分）。

标签

与 <area> 标签相关，该标签定义图像映射中的可点击区域。

用法

var path = areaObject.pathname;

实例

<img src="planets.jpg" usemap="#planetmap" alt="Planets">

<map name="planetmap">
  <area id="venus" shape="circle" coords="124,58,8" 
    href="venus.html" alt="Venus">
</map>

<script>
  var area = document.getElementById("venus");
  console.log(area.pathname); // 输出: "/venus.html"
</script>

功能

• 获取图像映射区域链接的路径部分

• 可用于动态修改或检查区域链接

• 返回的值不包括协议、域名或查询字符串

CSS 扩展

虽然 CSS 不能直接操作 pathname 属性，但可以基于路径名来设置样式：

/* 假设有 data-path 属性存储路径 */
area[data-path="/venus.html"] {
  outline: 2px solid red;
}

JavaScript 中可以这样设置：

area.setAttribute('data-path', area.pathname);

声明：本站所有文章资源内容，如无特殊说明或标注，均为采集网络资源。如若本站内容侵犯了原著者的合法权益，可联系本站删除。