常用javascript dom操作

以下代码不是最简洁的，但对于学习者来说更容易理解。

JS如何获取指定DIV下的子元素LI值

var div=document.getElementById('a');
var ul=div.childNodes.item(0);
var lis=ul.childNodes;
for(var i=0;i<lis.length;i++){
alert("Item "+i+": "+lis.item(i).innerHTML);
}

JS怎么获取当前点击的子元素的下标

var child = document.getElementsByClassName("child");

for (var i = 0; i < child.length; i++) {

    var a = child[i];

    a.index = i;//给每个className为child的元素添加index属性;

    a.onclick = function () {

        alert(this.index)

    }

}

 

 

  

原生JS实现addClass

var classVal = document.getElementById("id").getAttribute("class");

//删除的话
classVal = classVal.replace("someClassName","");
document.getElementById("id").setAttribute("class",classVal );

//添加的话
classVal = classVal.concat(" someClassName");
document.getElementById("id").setAttribute("class",classVal );

//替换的话
classVal = classVal.replace("someClassName","otherClassName");
document.getElementById("id").setAttribute("class",classVal );

　　

Object.prototype.hasClass = function(cls) {
return this.className.match(new RegExp('(\s|^)' + cls + '(\s|$)'));
};

Object.prototype.addClass = function(cls) {
if (!this.hasClass(cls)) this.className += " " + cls;
};

Object.prototype.removeClass = function(cls) {
if (this.hasClass(cls)) {
var reg = new RegExp('(\s|^)' + cls + '(\s|$)');
this.className = this.className.replace(reg, ' ');
}
};

Object.prototype.toggleClass = function(cls){
if(this.hasClass(cls)){
this.removeClass(cls);
}else{
this.addClass(cls);
}
};

.aaa {
    background: red;
}

<div id="choumafen1" class="hsds">test div</div>

    function addClass(element,value){
//如果元素类名为空，直接将value赋值给相应的元素类名
        console.log(element.className)
        if(!element.className){
            element.className = value;
        }else{
            //否则需要将类名之间用空格隔开
            newClassName = element.className;
            //多个类名间添加空格
            newClassName += ' ';
            newClassName += value;
            element.className = newClassName;
        }
    }
    var choumafen1=document.getElementById("choumafen1")
    addClass(choumafen1,'aaa')

作者:
https://zhidao.baidu.com/question/211012353.html
https://zhidao.baidu.com/question/982131582421985059.html
http://www.javascriptcn.com/read-1011.html

如何用原生的js删除标签中的类名和添加类名？

https://segmentfault.com/q/1010000002955089?sort=created
原生js添加删除class
http://blog.csdn.net/magicw3/article/details/45537725