1. 程式人生 > >jQuery-attr()和prop()用法總結

jQuery-attr()和prop()用法總結

今天遇到一個通過身份證的讀取,自動選擇性別的功能
開始用attr方法設定radio的checked屬性,radio確實被添加了checked=“checked”,但是對應的radio並沒有被選中
經過搜尋之後,發現改為prop方法便可以了,以下就總結一下了解到的關於attr()和prop()的一些總結。


在jQuery 1.6之前, 對於表單元素的checked、selected、disabled等屬性,attr()獲取這些屬性的返回值為Boolean型別:如果被選中(或禁用)就返回true,否則返回false。

jQuery 1.6之後有了porp()。


attr()和prop()的一些區別

操作的物件不同:

  • attr(): 針對的是該文件節點的attribute,包括節點本身已有的固有屬性和自定義屬性,對應原生中setAttribute和getAttribute。
  • prop():針對的是該DOM元素(Element型別的物件)自身的property,對應原生中obj[name]、obj[checked]

設定屬性值型別不同:

  • attr():操作的是文件節點的屬性,因此設定的屬性值只能是字串型別,如果不是字串型別,也會呼叫其toString()方法,將其轉為字串型別
  • prop():設定的屬性值可以為包括陣列和物件在內的任意型別

初始狀態值和實時狀態值:

jQuery認為:

  • attr():對應attribute的checked、selected、disabled就是表示該屬性初始狀態的值
  • prop():對應property的checked、selected、disabled才表示該屬性實時狀態的值(值為true或false)。

版本:

  • attr():是從1.6之前就使用的方法,1.6版本之前該函式不僅承擔了attribute的設定和獲取工作,還同時承擔了property的設定和獲取工作。(在jQuery 1.6之前,attr()也可以設定或獲取tagName、className、nodeName、nodeType等DOM元素的property)
  • prop():1.6版本之後才有,用來承擔property的設定或獲取工作,使得attr()才只用來負責attribute的設定和獲取工作。

使用建議

在jQuery 1.6及以後版本中,請使用prop()函式來設定或獲取checked、selected、disabled等屬性。對於其它能夠用prop()實現的操作,也儘量使用prop()函式

總結

最開始先是看到一個部落格說的是,自定義的屬性就用attr(),固有的屬性就使用prop(),多看了幾篇才發現不是很正確呀。
想想像我這樣水平的js菜鳥也會時不時寫幾個部落格,可想而知,部落格內容出錯的可能性還是很大的。
那我以前遇到不會的知識點搜到部落格就完全相信的行為蠻傻的。。
所以大家在看部落格時候還是不要盲目的去相信才好。
希望大家遇到錯誤多多指正吧,共同進步。