1.比較

　　相同點 : prop和attr作為jquery的方法都可以獲取屬性值;

　　不同點 : (1)?對于HTML元素本身就帶有的固有屬性，使用prop方法,

? ? ? ? ? ? ? ? ? ? ? ? ? attr獲取checkbox的checked屬性時選中的時候可以取到值,值為"checked"但沒選中獲取值就是undefined。

? ? ? ? ? ? ? ? ? ? ? ? ? jq提供新的方法“prop”來獲取這些屬性，以前我們使用attr獲取checked屬性時返回"checked"和"",現在使用prop方法獲取屬性則統一返回true和false

? ? ? ? ? ? ? ? ? ? ? (2)對于HTML元素我們自己自定義的DOM屬性，使用attr方法 // 對于自定義的屬性用prop方法取值和設置屬性值時，都會返回undefined值

?

2.栗子

(1)

<script type="text/javascript" >
$(function(){
? ? ? ?var flag=false;
　　$("#btn").click(function(){
　　if(flag==false){
　　　　$("#check").attr("checked",true);
　　　　flag=true;
　　}else{
　　　　$("#check").removeAttr("checked");
　　　　flag=false;
　　}
　　});

});

</script>

<input type="checkbox"? ?id="check" checked>
</br>
<input type="button" id="btn" value="btn btn">

//在第一次生效,勾選和取消之后就失效了,標簽中一直顯示checked="checked"

改用prop就可以了

if(flag==false){
　　　　$("#check").prop("checked",true);
　　　　flag=true;
　　}else{
　　　　$("#check").prop("checked",false);
　　　　flag=false;
　　}

(2) 使用原生js控制多選框的勾選狀態

<script>
function checkAll() {
　　var all=document.getElementById('all');//獲取到點擊全選的那個復選框的id
　　var one=document.getElementsByName('checkname[]');//獲取到復選框的名稱
　　if(all.checked==true){//因為獲得的是數組，所以要循環 為每一個checked賦值
　　　　for(var i=0;i<one.length;i++){
　　　　one[i].checked=true;
　　　　}

　　}else{
　　　　for(var j=0;j<one.length;j++){
　　　　one[j].checked=false;
　　　　}
　　}
}
</script>

轉載于:https://www.cnblogs.com/lizhiwei8/p/7682542.html

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的propattr区别和用法,以多选框为例的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。