最近開發中發現用attr無法設置checkbox的選中事件,在網上找了下説要用prop,所以總結下兩者的區別。
1、操作的對象不同
attr:操作的是HTML文檔節點屬性
prop:操作的是js對象屬性
2、應用版本不同
attr()是jQuery 1.0版本就有的函數,prop()是jQuery 1.6版本新增的函數。
在1.6之前,只能使用attr()函數;1.6及以後版本,你可以根據實際需要選擇對應的函數。
3、用於設置的屬性值類型不同
由於attr()函數操作的是文檔節點的屬性,因此設置的屬性值只能是字符串類型,如果不是字符串類型,也會調用其toString()方法,將其轉為字符串類型。
prop()函數操作的是JS對象的屬性,因此設置的屬性值可以為包括數組和對象在內的任意類型。
4、其他
使用attr()獲取這些屬性的返回值為String類型,如果被選中(或禁用)就返回checked、selected或disabled,否則(即元素節點沒有該屬性)返回undefined。
並且,在某些版本中,這些屬性值表示文檔加載時的初始狀態值,即使之後更改了這些元素的選中(或禁用)狀態,對應的屬性值也不會發生改變。
checked、selected、disabled就是表示該屬性初始狀態的值,
property的checked、selected、disabled才表示該屬性實時狀態的值(值為true或false)。
因此,在jQuery 1.6及以後版本中,請使用prop()函數來設置或獲取checked、selected、disabled等屬性。對於其它能夠用prop()實現的操作,也儘量使用prop()函數。