HTML DOM setAttribute() 方法
实例
将值为 "democlass" 的 class 属性添加到 <h1> 元素中:
document.getElementsByTagName("H1")[0].setAttribute("class", "democlass");
在设置属性之前:
Hello World
在设置属性之后:
Hello World
亲自试一试 »
页面下方有更多实例。
定义和用法
setAttribute() 方法将指定的属性添加到元素中，并为其指定值。
如果指定的属性已经存在，则只设置/更改该值。
注释: 虽然可以使用此方法将带有值的样式属性添加到元素中， 但建议您使用样式对象的属性来进行内联样式设置， 因为这不会覆盖样式属性中可能指定的其他CSS属性:
看起来不好:
element.setAttribute("style", "background-color: red;");
看起来不错:
element.style.backgroundColor = "red";
提示: Use the removeAttribute() method to remove an attribute from an element.
提示: See also the setAttributeNode() method.
浏览器支持
表中的数字表示支持该方法的第一个浏览器版本。
| 方法 | |||||
|---|---|---|---|---|---|
| setAttribute() | Yes | 8.0 | Yes | Yes | Yes |
语法
element.setAttribute(attributename, attributevalue)
参数值
| 参数 | 类型 | 描述 |
|---|---|---|
| attributename | String | 必需。要添加的属性的名称 |
| attributevalue | String | 必需。要添加的属性的值 |
技术细节
| 返回值: | 无返回值 |
|---|---|
| DOM 版本 | Core Level 1 Element Object |
更多实例
实例
将输入字段更改为输入按钮:
document.getElementsByTagName("INPUT")[0].setAttribute("type", "button");
在设置属性之前:
在设置属性之后:
实例
向 <a> 元素添加一个值为 "www.w3ccoo.com" 的 href 属性:
document.getElementById("myAnchor").setAttribute("href", "https://www.w3ccoo.com");
在设置属性之前:
Go to www.w3ccoo.com
在设置属性之后:
亲自试一试 »实例
找出 <a> 元素是否有目标属性。如果是，请将目标属性的值更改为 "_self":
// Get the <a> element with id="myAnchor"
var x = document.getElementById("myAnchor");
// If the <a> element has a target attribute, set the value to "_self"
if (x.hasAttribute("target")) {
x.setAttribute("target", "_self");
}
亲自试一试 »
相关页面
HTML 教程: HTML 属性
HTML DOM 参考手册: getAttribute() 方法
HTML DOM 参考手册: hasAttribute() 方法
HTML DOM 参考手册: removeAttribute() 方法
