属性和属性节点

概念

属性：对象身上保存的变量就是属性

属性节点:DOM对象身上保存的变量就是属性节点

• 区别：属性节点特指HTML文档中的元素的属性

原生JS操作属性节点

• DOM元素.setAttrbute('属性名称',‘值’)         // 设置属性节点
• DOM元素.getAttrbute('属性名称')               // 获取属性节点
• DOM元素.removeAttrbute('属性名称')        // 删除属性节点

jQuery操作属性节点

• attr(name|pro|key,val|fn) || prop(name|properties|key,value|fn)

  attr || prop 参数表

  参数 作用 注意点 代码 name 获取属性节点值 只返回找到的第一个属性节点的值

  $("img").attr("src");

  pro 设置属性节点值 设置所有找到的属性节点的值

  $("img").attr({ src: "test.jpg", alt: "Test Image" });

  key,value

  设置属性节点值 设置所有找到的属性节点的值

  $("img").attr("src","test.jpg");

  key,fn

  设置属性节点值 将fn返回值作为key的值

  $("img").attr("title", function() { return this.src });

• removeAttr(name) ||removeProp(name)

作用：删除属性节点

• attr与prop区别

具有true、false两个属性值的属性节点时使用prop（）方法，如disabled、selected、checked。其余使用attr（）方法

$(function(){
        console.log(
            $('input').eq(0).prop('checked'),   //true
            $('input').eq(0).attr('checked')    //checked
        )
})