我有一个元素已经有一个类：
<div class="someclass">
<img ... id="image1" name="image1" />
</div>
现在，我想创建一个JavaScript函数，它将向div添加一个类（不是替换，而是添加）。
我该怎么做？
当前回答
document.getElementById('some_id').className+=' someclassname'
OR:
document.getElementById('some_id').classList.add('someclassname')
当第二种方法不起作用时，第一种方法有助于添加类。在第一种方法中，不要忘记在“someclassname”前面留一个空格。
对于删除，您可以使用：
document.getElementById('some_id').classList.remove('someclassname')
其他回答
找到你想要的目标元素“d”，然后：
d.className += ' additionalClass'; //note the space
您可以用更聪明的方式来包装它，以检查预存在，检查空间需求等。。
假设您所做的不仅仅是添加这个类（例如，您还有异步请求等），我建议使用Prototype或jQuery这样的库。
这将使你需要做的所有事情（包括这个）变得非常简单。
假设您现在在页面上有jQuery，您可以使用如下代码向元素添加类名（在本例中是加载时）：
$(document).ready( function() {
$('#div1').addClass( 'some_other_class' );
} );
查看jQueryAPI浏览器以了解其他内容。
要以简单的方式添加、删除或检查元素类，请执行以下操作：
var uclass = {
exists: function(elem,className){var p = new RegExp('(^| )'+className+'( |$)');return (elem.className && elem.className.match(p));},
add: function(elem,className){if(uclass.exists(elem,className)){return true;}elem.className += ' '+className;},
remove: function(elem,className){var c = elem.className;var p = new RegExp('(^| )'+className+'( |$)');c = c.replace(p,' ').replace(/ /g,' ');elem.className = c;}
};
var elem = document.getElementById('someElem');
//Add a class, only if not exists yet.
uclass.add(elem,'someClass');
//Remove class
uclass.remove(elem,'someClass');
纯JS示例。在第一个示例中，我们获取元素的id并添加例如2个类。
document.addEventListener('DOMContentLoaded', function() {
document.getElementsById('tabGroup').className = "anyClass1 anyClass2";
})
在第二个示例中，我们获取元素的类名并再添加1。
document.addEventListener('DOMContentLoaded', function() {
document.getElementsByClassName('tabGroup')[0].className = "tabGroup ready";
})
在我的例子中，我在DOM中有多个称为主包装器的类，但我只想影响父主包装器。使用：第一选择器(https://api.jquery.com/first-selector/)，我可以选择第一个匹配的DOM元素。这是我的解决方案：
$(document).ready( function() {
$('.main-wrapper:first').addClass('homepage-redesign');
$('#deals-index > div:eq(0) > div:eq(1)').addClass('doubleheaderredesign');
} );
我还对DOM中特定div的第二个孩子做了同样的事情，正如您在代码中看到的那样，我使用了$（'#deals index>div:eq（0）>div:eq（1）'）.addClass（'doubleheadrredesign'）；。
注意：如您所见，我使用了jQuery。
