Javascript 中的 setAttribute

在 Javascript 中，我们经常需要操作 DOM 元素。其中一个常见的操作就是设置 HTML 元素的属性。这时候就可以使用 setAttribute 方法。

概述

setAttribute 是一个 DOM 元素的方法，它接受两个参数：属性名称和属性值。它的作用是设置元素的属性值。

element.setAttribute(name, value);

• name：属性名称，字符串类型。
• value：属性值，字符串类型。

例子

比如，我们要修改一个按钮元素的文字和颜色：

<button id="myButton">Click me</button>

const button = document.getElementById('myButton');

button.setAttribute('style', 'color: red;');
button.setAttribute('title', 'Click the button');

button.innerHTML = 'Don\'t click me!';

上面的代码将按钮的文字修改为 "Don't click me!"，文字颜色修改为红色，添加了鼠标悬停提示 "Click the button"。

注意事项

• 如果元素已经存在该属性，则会覆盖原有的值。
• 对于一些属性，比如 class 和 for，需要使用 setAttribute('class', 'value') 和 setAttribute('for', 'value') 的方式来设置。因为这些属性在 Javascript 中是保留关键字，所以不能直接当作属性名使用。
• 如果要移除一个属性，可以使用 removeAttribute 方法。

总结

setAttribute 方法是 Javascript 操作 DOM 元素的重要方法之一。它能够对 HTML 元素的属性进行修改和添加，非常方便实用。但需要注意，对于一些保留关键字的属性，需要使用 setAttribute 的方式来设置。