如何使用JavaScript添加/更新属性到HTML元素?

我试图find一种方法,将使用JavaScript添加/更新属性。 我知道我可以用setAttribute()函数做到这一点,但在IE中不起作用。

您可以在这里阅读许多不同浏览器(包括IE)的属性行为。

element.setAttribute()应该做的伎俩,即使在IE中。 你试过了吗? 如果它不工作,那么也许element.attributeName = 'value'可能工作。

如果你想完全兼容的话,看起来很简单的事情实际上是非常棘手的。

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

假设你有一个“div1”的id来添加。

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

这些都将工作除了最后在IE 5.5(这是古老的历史在这一点上,但仍然是XP的默认没有更新)。

但是当然有不测的地方。 在IE之前不会在8之前工作: e.attributes['style']不会错误,但实际上不会设置类,它必须是className: e['class']
但是,如果你使用属性,那么这将工作: e.attributes['class']

总之,把属性看作文字和面向对象。

在字面上,你只是想要吐出x ='y'而不去想它。 这是属性,setAttribute,createAttribute是什么(除了IE的样式exception)。 但是,因为这些是真正的对象,事情会变得困惑。

既然你要去正确地创build一个DOM元素而不是jQuery的innerHTML slop,那么我会把它看作一个,并且坚持使用e.className ='fooClass'和e.id ='fooID'。 这是一个devise偏好,但在这种情况下,试图处理的是除了对象之外的任何东西都与你相反。

它不会像其他方法一样反弹,只要知道class是className,style是一个对象,所以它的style.width不是style =“width:50px”。 还记得tagName,但这已经由createElement设置,所以你不应该担心它。

这比我想要的更长,但JS中的CSS操作是棘手的业务。

强制性的jQuery解决scheme 。 查找并设置title属性为foo 。 请注意,由于我是通过id来完成的,因此select了一个元素,但是通过更改select器,您可以轻松地在集合上设置相同的属性。

 $('#element').attr( 'title', 'foo' ); 

你想用属性做什么? 它是一个HTML属性或你自己的东西?

大多数情况下,您可以简单地将其作为属性来处理:想要在元素上设置标题? element.title = "foo"将做到这一点。

对于你自己定制的JS属性,DOM自然是可扩展的(又称expando = true),其简单的结果是你可以做element.myCustomFlag = foo ,然后读取它没有问题。