基础

/*查询选择器*/
$(function () {
    var aSample = document.querySelectorAll(".sample");
    var oSample = document.querySelector(".sample");
    for(var i= 0,l=aSample.length;i<l;i++){
        aSample[i].addEventListener("click", function (event) {
            event.preventDefault();
            funClearClass(aSample,"active");
            funSetClass(this,"active");
        });
    }
    function funSetClass(oDiv,sClassName) {
        if (!sClassName)    return;
        var isExist = oDiv.classList.contains(sClassName);
        if (!isExist)    oDiv.classList.add(sClassName);
    }
    function funClearClass(aDiv,sClassName) {
        if (!sClassName)    return;
        var isExist = true;
        for(var i= 0,l=aDiv.length;i<l;i++){
            isExist = aDiv[i].classList.contains(sClassName);
            if (isExist)    aDiv[i].classList.remove(sClassName);
        }
    }

});

　　

/*查询选择器*/
$(function () {
    var aSample = document.querySelectorAll(".sample");
    for(var i= 0,l=aSample.length;i<l;i++){
        aSample[i].addEventListener("click", function (event) {
            event.preventDefault();
         
             isExist = aDiv[i].classList.contains(sClassName);
             aDiv[i].classList.toggle("normal",!isExist);
        });
    }
});