基于DOM对象---------2

1.设置标签中的文本内容

//设置标签中的文本内容，应该用textContent属性，谷歌，火狐支持，IE8不支持
//设置标签中的文本内容，应该用innerContent属性，谷歌，火狐,IE8都支持

//如果这个属性在浏览器中不支持，那么这个属性的类型是undefined
//兼容代码
//设置任意标签中的任意文本内容
function setInnerText(element,text){
    if(typeof element.textContent=="undefined"){
        element.innerText=text;
    }else{
        element.textContent=text;
    }
}
//获取任意标签中的文本内容
function getInnerText(element){
    if(typeof element.textContent=="undefined"){
        return element.innerText;
    }else{
        return element.textContent;
    }
}

2.innerHTML和innerText的区别

//总结：
 /**
 * 如果想要(获取)标签及内容：使用innerHTML;
 * 如果想要设置标签，使用innerText
 * 如果想要设置文本，用innerText，或者innerHTML，或者textContent
 */

3.自定义属性

//html标签没有这个属性，自己添加的属性----自定义属性
//在html标签中添加的自定义属性，如果想要获取这个属性的值，需要使用getAttribute("自定义属性的名字");才能获取这个属性的值
var list=document.getElementsByTagName("li");
for(var i=0;i<list.length;i++){
    list[i].onclick= function () {
        alert(this.getAttribute("score"));
    };
}

/**
 * 自定义属性的设置与获取
 * 设置自定义属性：setAttribute("属性名",属性值);
 * 获取自定义属性：getAttribute("属性名");
 * @type {NodeList}
 */

//根据id获取ul标签，并且获取该标签中的所有li
var list=my$("uu").getElementsByTagName("li");
for(var i=0;i<list.length;i++){
    //先为每个li添加自定义属性
   // list[i].score=(i+1)*10;//此方式，自定义属性在DOM对象上，不在标签中
    list[i].setAttribute("score",(i+1)*10);

    //点击每个li标签，显示对应的自定义属性
    list[i].onclick= function () {
      alert(this.getAttribute("score"));
    };
}
 //移除自定义属性：removeAttribute（"属性名"）；----也可以移除元素的类样式
 my$("btn").onclick= function () {
    my$("dv").removeAttribute("score");
    //移除元素的类样式
    //my$("dv").className="";//值没了，但是属性还有
    my$("dv").removeAttribute("class");//都没了

};