如何将一个类添加到给定的元素？

2018-06-17 02:28:16

我有一个已经有一个类的元素：

<div class="someclass">
    <img ... id="image1" name="image1" />
</div>

现在我想创建一个Javascript函数，它将向div添加一个类（不是替换，而是添加）。

我怎样才能做到这一点？

向元素的className属性添加一个空格和新类的名称。首先，在元素上添加一个id ，以便您可以轻松获取参考。

<div id="div1" class="someclass">
    <img ... id="image1" name="image1" />
</div>

然后

var d = document.getElementById("div1");
d.className += " otherclass";

另请参阅MDN上的element.className。

没有任何框架的最简单的方法是使用element.classList.add方法。

var element = document.getElementById("div1");
element.classList.add("otherclass");

编辑：如果你想从一个元素中删除类 -

element.classList.remove("otherclass");

我更喜欢不用自己添加任何空白空间和重复的条目处理（这在使用document.className方法时是必需的）。有一些浏览器限制，但你可以使用polyfills来解决它们。

无论您希望如何找到您的目标元素“d”，然后：

d.className += ' additionalClass'; //note the space

你可以用更聪明的方式来包装，以检查存在，并检查空间要求等。

链接地址: http://www.djcxy.com/p/48357.html