参考资料

1. HTML DOM 用指定的Name弹出元素的数量实例
2. HTML DOM 返回一个iframe中的marginwidth属性的值
3. HTML DOM获得下拉列表的选项数量
4. HTML DOM 返回一个表单acceptCharset属性的值
5. HTML DOM 设置image的hspace和vspace属性
6. HTML DOM 对image排版
7. HTML DOM一个行的innerHTML
8. HTML DOM 返回加载的文档的服务器域名 实例

HTML DOM Image 对象的 name 属性

详细介绍

Image 对象的 name 属性用于获取或设置 <img> 元素的 name 属性值。name 属性为图像指定一个名称，可以通过脚本引用该图像。

标签语法

<img name="imageName" src="image.jpg">

用法

• 获取 name 属性值：document.images[index].name

• 设置 name 属性值：document.images[index].name = "newName"

实例

<img id="myImage" name="logo" src="logo.png">

<script>
  // 获取 name 属性
  var imgName = document.getElementById("myImage").name;
  console.log(imgName); // 输出: "logo"
  
  // 设置 name 属性
  document.getElementById("myImage").name = "newLogo";
</script>

功能

• 为图像元素提供标识名称

• 便于通过脚本访问特定图像

• 可用于表单提交时标识图像

CSS 扩展

虽然 name 属性主要用于 JavaScript 访问，但也可以通过 CSS 属性选择器进行样式设置：

/* 通过 name 属性选择图像 */
img[name="logo"] {
  border: 2px solid blue;
}

/* 所有有 name 属性的图像 */
img[name] {
  margin: 10px;
}

注意：在现代 HTML5 中，id 和 class 属性更常用于样式和脚本访问，name 属性主要用于表单元素。