HTML DOM setAttribute() 方法
实例
将值为 "democlass" 的 class 属性添加到 <h1> 元素中:
 document.getElementsByTagName("H1")[0].setAttribute("class", "democlass");
 在设置属性之前:
在设置属性之后:
页面下方有更多实例。
定义和用法
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.begtut.com" 的 href 属性:
 document.getElementById("myAnchor").setAttribute("href", "https://www.begtut.com"); 
在设置属性之前:
Go to begtut.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");
}
亲自试一试 »
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() 方法
