首頁 > 文章 > web前端 > jquery元素固有屬性的操作:prop()和removeProp()

jquery元素固有屬性的操作:prop()和removeProp()

无忌哥哥原創: 2018-06-29 11:49:381730瀏覽

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>2.元素固有属性的操作:prop()和removeProp()</title>
</head>
<body>
<img src="../images/fbb.jpg" width="200" alt="美女" title="明星" id="pic" data-nation="中国">
</body>

1.prop():只能取得元素的固有屬性

取得固有屬性alt,title

var res = $(&#39;#pic&#39;).prop(&#39;alt&#39;)
var res = $(&#39;#pic&#39;).prop(&#39;title&#39;)

取得自訂屬性data-nation,返回undefined,取得不到

var res = $(&#39;#pic&#39;).prop(&#39;data-nation&#39;)

但是如何使用prop()進行動態設定自訂屬性後,就可以正常取得到

var res = $(&#39;#pic&#39;).prop(&#39;data-nation&#39;,&#39;中国山东&#39;)

此時查看元素,發現自訂屬性並未變更,所以這種設定對元素無影響

此時再次檢視到的自訂屬性值,只是存在於目前腳本的一個臨時資料

var res = $(&#39;#pic&#39;).prop(&#39;data-nation&#39;)

2.removeProp()

這個方法與removeAttr()有二點不同:

1.不支援空格分隔的屬性清單字串,即一次只能刪除一個屬性

2.它不能刪除原生屬性,如果真要刪除,只要將值設為false即可

不能同時移除多個屬性,所以此條語句無效

var res = $(&#39;#pic&#39;).removeProp(&#39;alt data-nation&#39;)

刪除自訂屬性data-nation

var res = $(&#39;#pic&#39;).removeProp(&#39;data-nation&#39;)

刪除原生固有的屬性alt,刪除失敗

var res = $(&#39;#pic&#39;).removeProp(&#39;alt&#39;)

用removeAttr()刪除原生屬性alt, 刪除成功

var res = $(&#39;#pic&#39;).removeAttr(&#39;alt&#39;)

所以,如果要用removeProp()刪除原生屬性,大多情況下將值設為false即可

#最終由使用者腳本自行處理

var res = $(&#39;#pic&#39;).prop(&#39;alt&#39;,false)
var res = $(&#39;#pic&#39;).prop(&#39;alt&#39;)

控制台查詢結果

console.log(res)

以上是jquery元素固有屬性的操作:prop()和removeProp()的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：jquery屬性與自訂屬性運算:attr()和removeAttr()下一篇：jquery屬性與自訂屬性運算:attr()和removeAttr()

看更多