jQuery 獲取設定刪除物件屬性
獲取、設定、刪除jQuery物件的屬性值
jQuery 提供了一系列處理元素屬性的方法,可以獲取屬性值,設定一個屬性值,通過對映物件設定多個屬性值,通過函式動態設定屬性值,也可以刪除屬性。可以通過使用attr方法和prop方法實現:
attr方法:
1. attr(name) :獲取jquery物件中第一個元素對應屬性的值。
我們可以結合each方法使用attr 方法讀取jquery物件中每一個元素的屬性。方法引數為元素的索引和元素。
2. attr(name,value):為“name”屬性設定“value”值,此處和第一個方法不同,它設定的是jquery物件中所有元素的屬性。
3. attr(map):通過建立對映物件,這個物件的屬性名被解釋為元素的屬性名,屬性值作為元素的屬性值。將這個物件傳遞給attr方法,實現在一次attr方法呼叫中設定多個屬性。示例程式碼如下:
<script type="text/javascript">
$(document).ready(function(){
var attrValues = {
src: "lily.png",
style: "border:thick solid red"
};
$("img").attr(attrValues);
});
</script>
4.attr(name,function):通過函式動態設定屬性值,如果函式的返回值為字串,則這個值被設定為屬性的新值,反之,使用屬性的原始值。
$("img").attr("src",function(index,oldVal){
if(oldVal.indexOf("rose")>-1)
{
return "lily.png";
}
else {
return "";
}
}
5.removeAttr(name): 刪除屬性
prop方法
attr 方法和prop方法使用方式相似,只需要把attr字串換為prop即可,但兩者的區別還是得重視的。
這兩者的區別是prop方法處理HTMLElement物件定義的屬性,而不是我們能夠看到的那些字面屬性(我們在html標籤中看到的那些屬性)。字面屬性通常與元素物件定義的屬性相同,但是也有例外。在HTMLElement物件中使用className(property)而非class(attribute)表示。