参考资料

1. HTML DOM 返回一个表单中元素的数量 实例
2. HTML DOM 返回图像映射某个区域的替代文字实例
3. HTML DOM shift键被按下了吗？
4. HTML DOM 返回和设置链接的href属性实例
5. HTML DOM删除下拉列表中的选项
6. HTML DOM document.write() 方法
7. HTML DOM 返回图像映射的某个区域的href 实例
8. HTML DOM 元素

HTML DOM 返回image的name

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 属性主要用于表单元素。