非表单元素的属性

href、title、id、src

<a href="http://www.baidu.com" title="baidu" id="link">点我</a>
var link = document.getElementById('link');
//通过console.dir(link) 可以查看该a节点对象的所有信息
//通过打印我们发现除了title和href属性之外，document文档对象模型还帮我们封装了其他很多属性
console.dir(link);
console.log(link.href);
console.log(link.title);
console.log(link.host);
var pic = document.getElementById('pic');
console.log(pic.src);
//我们也可以直接通过link.href = "xx"来给属性赋值

innerText/textContent/innerHTML/value

a) textContent和innerText的区别

     textContent : 设置标签中的文本内容,谷歌,火狐支持,IE8不支持            <br />             innerText : 设置标签中的文本内容,谷歌,火狐,IE8都支持<br />             如果这个属性在浏览器中不支持,那么这个属性的类型是undefined，所以判断这个属性的类型是不是    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;
    }
  }

b) innerText和innerHTML的区别

     如果使用innerText主要是设置和获取文本的,设置标签内容,是没有标签的效果的<br />         innerHTML主要的作用是在标签中设置新的html或者获取html标签内容,是有标签效果的<br />

my$("btn").onclick=function () {
    my$("dv").innerText="哈哈";//设置文本
    my$("dv").innerText="<p>这是一个p</p>";//设置html标签的代码
    my$("dv").innerHTML="哈哈";
    my$("dv").innerHTML="<p>这是一个p</p>";//设置Html标签的
  };
  //获取
  my$("btn2").onclick=function () {
    //可以获取标签中的文本内容
    console.log(my$("dv").innerText);
    console.log(my$("dv").innerHTML);
  };

c) value : 主要是用来给value属性赋值

类名操作 : 修改标签的className属性相当于直接修改标签的类名

var box = document.getElementById('box');
box.className = 'clearfix';