JavaScript Element setAttribute() 方法

• 

  JavaScript Element setAttribute() 方法

  setAttribute()方法将指定的属性添加到元素，并为其指定值。如果指定的属性已存在，则仅设置/更改该值。

  注意：虽然可以使用此方法将带有值的style属性添加到元素，但建议您使用Style对象的属性代替内联样式，因为这不会覆盖可能在其中指定的其他CSS属性。 style属性：

  坏的示范

  element.setAttribute("style", "background-color: red;");
  

  好的示范

  element.style.backgroundColor = "red";
  

  提示：使用removeAttribute()方法从元素中删除属性。

  提示：另请参见setAttributeNode()方法。

  实例：

  将值为“democlass”的class属性添加到<h1>元素：

  document.getElementsByTagName("H1")[0].setAttribute("class", "democlass");
  

  尝试一下
• 

  浏览器支持

  项	IE/Edge	Chrome	FireFox	Safari	Opera
  方法
  setAttribute()	8.0+	支持	支持	支持	支持

• 

  语法

  element.setAttribute(attributename, attributevalue)
• 

  参数值

  参数	类型	描述
  attributename	String	必需的。 要添加的属性的名称
  attributevalue	String	必需的。 要添加的属性的值

• 

  技术细节

  项目	描述
  返回值：	没有
  DOM版本	Core Level 1

• 

  更多例子

  将输入字段更改为输入按钮：

  document.getElementsByTagName("INPUT")[0].setAttribute("type", "button");
  

  尝试一下

  将值为“www.cainiaoya.com”的href属性添加到<a>元素：

  document.getElementById("myAnchor").setAttribute("href", "https://www.cainiaoya.com");
  

  尝试一下

  找出<a>元素是否具有目标属性。如果是这样，请将target属性的值更改为“_self”：

  // 获取id =“myAnchor”的a元素
  var x = document.getElementById("myAnchor");  
  
  // 如果a元素具有target属性，请将值设置为“_self”
  if (x.hasAttribute("target")) {       
    x.setAttribute("target", "_self");
  }
  

  尝试一下
• 

  相关页面

  HTML教程：HTML属性

  HTML DOM参考：getAttribute()方法

  HTML DOM参考：hasAttribute()方法

  HTML DOM参考：removeAttribute()方法