aaClass()封装通用函数，解classNames属性替换而不是追加问题

Posted 2020-07-14

function styleHeadersSiblings(){
if(!document.getElementsByTagName) return false;
var headers = document.getElementsByTagName("h1");
for(var i = 0;i < headers.length; i++){
var elem = getNextElement(headers[i].nextSibling);
//elem.style.color = "red";
//elem.style.fontSize = "1.2em";
//以下使用className属性，该属性是替换，不是追加
//elem.className = "intro";                  //.intro{ color:red;font-size:1.2em;}
addClass(elem,"intro");//调用封装函数
}
}

//elem.className +=" intro"    注意，intro的第一个字符是空格，表示把新的calss属性追加到原来属性上去
//如过原来没有属性，则对className直接赋值即可，而不需要追加
//因此我们可以把以上步骤封装成一个函数进行通用
function addClass(element,value){
if(!element.className){
element.className = value;
}else{
newClassName = element.className;
newClassName += "";
newClassName += value;
element.className = newClassName;
}
}