jquery 學(xué)習(xí)之二 屬性相關(guān)
取得第一個(gè)匹配元素的屬性值。通過這個(gè)方法可以方便地從第一個(gè)匹配元素中獲取一個(gè)屬性的值。如果元素沒有相應(yīng)屬性,則返回 undefined 。
Access a property on the first matched element. This method makes it easy to retrieve a property value from the first matched element. If the element does not have an attribute with such a name, undefined is returned.
返回值
Object
參數(shù)
name (String) : 屬性名稱
示例
返回文檔中第一個(gè)圖像的src屬性值。
HTML 代碼:
<img src="test.jpg"/>
jQuery 代碼:
$("img").attr("src");
結(jié)果:
test.jpg
---------------------------------------------------------------------------------------------------------------------------------------
attr(properties)
將一個(gè)“名/值”形式的對(duì)象設(shè)置為所有匹配元素的屬性。
這是一種在所有匹配元素中批量設(shè)置很多屬性的最佳方式。 注意,如果你要設(shè)置對(duì)象的class屬性,你必須使用'className' 作為屬性名。或者你可以直接使用.addClass( class ) 和 .removeClass( class ).
Set a key/value object as properties to all matched elements.
This serves as the best way to set a large number of properties on all matched elements. Note that you must use 'className' as key if you want to set the class-Attribute. Or use .addClass( class ) or .removeClass( class ).
返回值
jQuery
參數(shù)
properties (Map) : 作為屬性的“名/值對(duì)”對(duì)象
示例
為所有圖像設(shè)置src和alt屬性。
HTML 代碼:
<img/>
jQuery 代碼:
$("img").attr({ src: "test.jpg", alt: "Test Image" });
結(jié)果:
[ <img src= "test.jpg" alt:="Test Image" /> ]
---------------------------------------------------------------------------------------------------------------------------------------
attr(key,value)
為所有匹配的元素設(shè)置一個(gè)屬性值。
Set a single property to a value, on all matched elements.
返回值
jQuery
參數(shù)
key (String) : 屬性名稱
value (Object) : 屬性值
示例
為所有圖像設(shè)置src屬性。
HTML 代碼:
<img/>
<img/>
jQuery 代碼:
$("img").attr("src","test.jpg");
結(jié)果:
[ <img src= "test.jpg" /> , <img src= "test.jpg" /> ]
---------------------------------------------------------------------------------------------------------------------------------------
attr(key,fn)
為所有匹配的元素設(shè)置一個(gè)計(jì)算的屬性值。
不提供值,而是提供一個(gè)函數(shù),由這個(gè)函數(shù)計(jì)算的值作為屬性值。
Set a single property to a computed value, on all matched elements.
Instead of supplying a string value as described 'above', a function is provided that computes the value.
返回值
jQuery
參數(shù)
key (String) : 屬性名稱
fn (Function) : 返回值的函數(shù) 范圍:當(dāng)前元素, 參數(shù): 當(dāng)前元素的索引值
示例
把src屬性的值設(shè)置為title屬性的值。
HTML 代碼:
<img src="test.jpg"/>
jQuery 代碼:
$("img").attr("title", function() { return this.src });
結(jié)果:
<img src="test.jpg" title="test.jpg" />
---------------------------------------------------------------------------------------------------------------------------------------
removeAttr(name)
從每一個(gè)匹配的元素中刪除一個(gè)屬性
Remove an attribute from each of the matched elements.
返回值
jQuery
參數(shù)
name (String) : 要?jiǎng)h除的屬性名
示例
將文檔中圖像的src屬性刪除
HTML 代碼:
<img src="test.jpg"/>
jQuery 代碼:
$("img").removeAttr("src");
結(jié)果:
[ <img /> ]
相關(guān)文章
JavaScript的jQuery庫中ready方法的學(xué)習(xí)教程
這篇文章主要介紹了JavaScript的jQuery庫中ready方法的學(xué)習(xí)教程,包括ready的相關(guān)簡(jiǎn)短寫法,rally cool,需要的朋友可以參考下2015-08-08Jquery+CSS 創(chuàng)建流動(dòng)導(dǎo)航菜單 Fluid Navigation
有時(shí),一個(gè)網(wǎng)站的導(dǎo)航菜單文字不能提供足夠的信息,來表達(dá)當(dāng)前菜單按鈕的內(nèi)容,一般的解決辦法是使用提示信息ToolTip,那么本文介紹的流動(dòng)導(dǎo)航菜單Fluid Navigation也可以解決此問題,同時(shí)也為網(wǎng)站設(shè)計(jì)的添加了一些時(shí)尚而又動(dòng)感元素。2010-02-02jQuery+vue.js實(shí)現(xiàn)的多選下拉列表功能示例
這篇文章主要介紹了jQuery+vue.js實(shí)現(xiàn)的多選下拉列表功能,涉及jQuery+vue.js數(shù)據(jù)綁定及事件響應(yīng)相關(guān)操作技巧,需要的朋友可以參考下2019-01-01jQuery簡(jiǎn)單獲取DIV和A標(biāo)簽元素位置的方法
這篇文章主要介紹了jQuery簡(jiǎn)單獲取DIV和A標(biāo)簽元素位置的方法,結(jié)合實(shí)例形式分析了jQuery針對(duì)頁面div及A標(biāo)簽元素相關(guān)操作技巧,需要的朋友可以參考下2017-02-02jquery實(shí)現(xiàn)動(dòng)態(tài)改變div寬度和高度
這篇文章主要介紹了jquery實(shí)現(xiàn)動(dòng)態(tài)改變div寬度和高度,效果非常不錯(cuò),而且兼容性也很好,有需要的小伙伴可以參考下。2015-05-05jquery ajax學(xué)習(xí)筆記2 使用XMLHttpRequest對(duì)象的responseXML
使用XMLHttpRequest對(duì)象的responseXML的方式來接受XML數(shù)據(jù)對(duì)象的DOM對(duì)象2011-10-10jQuery實(shí)現(xiàn)鼠標(biāo)滑過圖片移動(dòng)特效
這篇文章主要介紹了jQuery實(shí)現(xiàn)鼠標(biāo)滑過圖片移動(dòng)特效,鼠標(biāo)移動(dòng)到圖片上時(shí)圖片向上動(dòng)一下,等到鼠標(biāo)離開后,圖片又返回到原來位置,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12