如何使用JavaScript向HTML元素添加/更新属性？

How to add/update an attribute to an HTML element using JavaScript?

我正在尝试找到一种使用JavaScript添加/更新属性的方法。我知道我可以使用setAttribute()函数来做到这一点，但是在IE中不起作用。

您可以在此处阅读有关许多不同浏览器(包括IE)中属性的行为的信息。

element.setAttribute()应该可以解决问题，即使在IE中也是如此。你试过了吗？如果它不起作用，那么也许
element.attributeName = 'value'可能有效。

如果要完全兼容，看起来容易的事情实际上是棘手的。

1	var e = document.createElement('div');

假设您要添加一个ID为" div1"。

1
2
3
4

e['id'] = 'div1';
e.id = 'div1';
e.attributes['id'] = 'div1';
e.createAttribute('id','div1')

除IE 5.5中的最后一个(这是很久以前的历史，但XP的默认设置，没有更新)，所有这些都将起作用。

但是，当然有偶然性。
8：e.attributes['style']之前的版本在IE中将不起作用
不会出错，但实际上不会设置类，它必须是className：e['class']。
但是，如果您使用的是属性，则它将起作用：e.attributes['class']

总而言之，将属性视为文字和面向对象。

从字面上看，您只希望它吐出x ='y'而不考虑它。这就是属性setAttribute和createAttribute的用途(IE的样式异常除外)。但是由于这些对象确实是对象，因此可能会造成混淆。

由于您将不得不正确地创建DOM元素而不是jQuery innerHTML slop，因此我将其视为一个，并坚持使用e.className ='fooClass'和e.id ='fooID'。这是一种设计偏好，但是在这种情况下，尝试将对象视为对您不利的任何事物。

它永远不会像其他方法那样对您产生适得其反的效果，只是要知道类是className，样式是对象，所以它是style.width而不是style =" width：50px"。还要记住tagName，但这已经由createElement设置，因此您不必担心它。

这比我想要的要长，但是JS中的CSS操作是一件棘手的事情。