Jquery attr 和removeAttr 的簡單使用

用法一: $(選擇器).attr(屬性名) 它的做用就是獲取指定元素( $(選擇器)部分 )的指定屬性的值. 看例子:

有這樣一段html:

<img src=「http://t.douban.com/lpic/s3791510.jpg」 alt=「變形金剛海報」 width=「500″ height=「300″ />

那麼你要獲取到圖片的地址該怎麼辦呢? 這樣: $(」img」).attr(」src」) 就這麼簡單, 你用alert或者其它形式輸出一下就看到圖片的地址了. 那麼我要取得圖片的描述呢? 這樣: $(」img」).attr(」alt」) .夠簡單吧. 它不但能夠取到html自己有的屬性, 並且也能取到你本身定義的屬性, 好比上例中的 funny屬性, 本身試試能不能獲取到它的值. 注意: 若是你要獲取的屬性是不存在的, 那麼jquery就會返回一個 undefined .

用法二: $(選擇器).attr(屬性名, 屬性值) 它的做用是爲全部匹配的元素設置一個屬性值。

假如頁面中有一堆這樣的html:

<img /><img />

咱們寫一句這樣的jquery代碼: $(」img」).attr(」src」,」http://t.douban.com/lpic/s3791510.jpg」) 這樣上面一堆無心義的img標籤就變成了:

<img src=「http://t.douban.com/lpic/s3791510.jpg」 /><img src=「http://t.douban.com/lpic/s3791510.jpg」 />

很容易理解吧. 假如咱們想給圖片設置高度,那麼只要 $(」img」).attr(」height」,」300″) . 再要設置寬度就這樣: $(」img」).attr(」width」,」500″) . 如此看來是沒有什麼問題, 可是當要設置多個屬性時, 一個一個的這樣寫真是太麻煩了, 那麼咱們來看第三個用法.

用法三: $(選擇器).attr(Map) 它的意思就是給指定元素設置多個屬性值, 咱們重點看一下 Map 是什麼意思. 它實際上是這樣一種序列:

{屬性名一: 「屬性值一」 , 屬性名二: 「屬性值二」 , … … }

那麼我要實現用法二中的例子只要這樣寫:

$(「img」).attr({src:「http://t.douban.com/lpic/s3791510.jpg」 , height: 「300″ , width : 「500″})

以上咱們學會了獲取屬性值, 設置屬性值, 那麼怎麼刪除屬性呢?

jquery中刪除屬性的關鍵詞是: removeAttr 注意A是大寫的. 看看怎麼用的:

一樣是用法一中的html代碼, 我想刪掉圖片的高度屬性, 那麼就這樣:

$(「img」). removeAttr(「height」);

嗯,就這麼簡單.  attr 其實就是原生js中 getAttribute 的簡化實現, 而removeAttr 就是 removeAttribute 的簡寫了