我会使用jQuery编写如下内容：

jQuery(function($) {
    $("#some-element").click(function() {
        $(this).toggleClass("clicked");
    });
});

这段代码添加了一个函数，当单击id some元素的元素时调用该函数。如果元素的class属性还不是它的一部分，则该函数会将单击的内容追加到该元素的class特性中，如果它存在，则会将其删除。

是的，您确实需要在页面中添加对jQuery库的引用才能使用这段代码，但至少您可以确信库中的大多数函数都可以在几乎所有现代浏览器上运行，并且这将节省您实现自己代码的时间。

可以这样使用node.className：

document.getElementById('foo').className = 'bar';

根据PPK，这应该在Internet Explorer 5.5及更高版本中工作。

哇，奇怪这里有这么多过分的答案。。。

<div class="firstClass" onclick="this.className='secondClass'">

在支持Internet Explorer 6的普通JavaScript中更改元素的类

您可以尝试使用node attributes属性来保持与旧浏览器（甚至Internet Explorer 6）的兼容性：

函数getClassNode（元素）{对于（var i=element.attributes.length；i-；）if（element.attributes[i].nodeName=='class'）return元素.attributes[i]；}函数removeClass（classNode，className）{var索引，classList=classNode.value.split（“”）；如果（（index=classList.indexOf（className））>-1）{classList.拼接（索引，1）；classNode.value=classList.join（“”）；}}函数hasClass（classNode，className）{return classNode.value.indexOf（className）>-1；}函数addClass（classNode，className）{if（！hasClass（classNode，className））classNode.value+=“”+className；}document.getElementById（'message'）.addEventListener（'click'，function（）{var classNode=getClassNode（this）；var className=hasClass（classNode，“red”）&&“blue”| |“red”；removeClass（classNode，'red'）；removeClass（classNode，'blue'）；addClass（classNode，className）；}).红色{颜色：红色；}.红色：之前{内容：“我红了！”；}.红色：之后{content:'再次'；}.蓝色{颜色：蓝色；}.蓝色：之前{内容：“我是蓝色的！”}<span id=“message”class=“”>单击我</span>

这是我的版本，完全可用：

function addHTMLClass(item, classname) {
    var obj = item
    if (typeof item=="string") {
        obj = document.getElementById(item)
    }
    obj.className += " " + classname
}

function removeHTMLClass(item, classname) {
    var obj = item
    if (typeof item=="string") {
        obj = document.getElementById(item)
    }
    var classes = ""+obj.className
    while (classes.indexOf(classname)>-1) {
        classes = classes.replace (classname, "")
    }
    obj.className = classes
}

用法：

<tr onmouseover='addHTMLClass(this,"clsSelected")'
onmouseout='removeHTMLClass(this,"clsSelected")' >

对于IE v6-9（其中不支持classList，并且不希望使用polyfills）：

var elem = document.getElementById('some-id');

// don't forget the extra space before the class name
var classList = elem.getAttribute('class') + ' other-class-name';

elem.setAttribute('class', classList);