JQuery中根據(jù)屬性或?qū)傩灾但@得元素(6種情況獲取方法)
更新時間:2013年01月17日 11:00:24 作者:
根據(jù)屬性或?qū)傩灾但@得元素本文介紹六種不同的情況獲取方法,有需要的朋友可以參考下
根據(jù)屬性獲得元素
1.比如要獲取頁面p標(biāo)簽中屬性有id的元素
$("p[id]").css("color","red");
根據(jù)屬性值獲得元素
1.$。在jQuery 中$("<span>"),這個語法等同于$(document.createElement("span")) ,這是一種用法,在選擇元素的時候還會這樣子的用:[attribute$=value],匹配給定的屬性是以某些值結(jié)尾的元素。下面舉個例子來說明一下:
HTML代碼
<input name="newsletter" />
<input name="milkman" />
<input name="jobletter" />
jQuery 代碼:
$("input[name$='letter']")
結(jié)果:
[ <input name="newsletter" />, <input name="jobletter" /> ]
2.!。選擇器:[attribute!=value],匹配所有不含有指定的屬性,或者屬性不等于特定值的元素,此選擇器等價于:not([attr=value])。
例子說明一下:
HTML代碼
<input type="checkbox" name="newsletter" value="Hot Fuzz" />
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />
jQuery 代碼:
$("input[name!='newsletter']").attr("checked", true);
結(jié)果:
[ <input type="checkbox" name="accept" value="Evil Plans" checked="true" /> ]
3.*。選擇器:[attribute*=value],匹配給定的屬性是以包含某些值的元素。舉個例子說明一下:
HTML 代碼:
<input name="man-news" />
<input name="milkman" />
<input name="letterman2" />
<input name="newmilk" />
jQuery 代碼:
$("input[name*='man']")
結(jié)果:
[ <input name="man-news" />, <input name="milkman" />, <input name="letterman2" /> ]
4.@。匹配包含給定屬性的元素。注意,在jQuery 1.3中,前導(dǎo)的@符號已經(jīng)被廢除!如果想要兼容最新版本,只需要簡單去掉@符號即
可。
5.^。選擇器:[attribute^=value],匹配給定的屬性是以某些值開始的元素,下面舉個例子來說明一下:
HTML 代碼:
<input name="newsletter" />
<input name="milkman" />
<input name="newsboy" />
jQuery 代碼:
$("input[name^='news']")
結(jié)果:
[ <input name="newsletter" />, <input name="newsboy" /> ]
6 獲取指定屬性且設(shè)定值中有指定字符串的元素
HTML 代碼:
<input type="checkbox" name="newsletter" value="Hot Fuzz"/>
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />
jQuery代碼:
$("input[name$='letter'][value$='zz']").attr("checked","true");支持多條件操作
當(dāng)然了,也可以根據(jù)id屬性或其他屬性來獲取,如$("input[id=id1]").css("color",red);
在jquery中,當(dāng)使用$(”input[name='metaId']“).val()不能直接獲得被選擇的radio的值,只是獲得 radio標(biāo)簽的第一個值,這可能jquery使用xpath語言了進行查找有關(guān),而我們通常是想獲得被選中的radio的值,有以下幾種方法:
1,使用$(”input[name='metaId']:checked”).val()獲得 //name代表radio中name屬性名
2,使用$(”:radio:checked”).val()獲得 //限制頁面只有一組radio標(biāo)簽
1.比如要獲取頁面p標(biāo)簽中屬性有id的元素
復(fù)制代碼 代碼如下:
$("p[id]").css("color","red");
根據(jù)屬性值獲得元素
1.$。在jQuery 中$("<span>"),這個語法等同于$(document.createElement("span")) ,這是一種用法,在選擇元素的時候還會這樣子的用:[attribute$=value],匹配給定的屬性是以某些值結(jié)尾的元素。下面舉個例子來說明一下:
HTML代碼
復(fù)制代碼 代碼如下:
<input name="newsletter" />
<input name="milkman" />
<input name="jobletter" />
jQuery 代碼:
復(fù)制代碼 代碼如下:
$("input[name$='letter']")
結(jié)果:
[ <input name="newsletter" />, <input name="jobletter" /> ]
2.!。選擇器:[attribute!=value],匹配所有不含有指定的屬性,或者屬性不等于特定值的元素,此選擇器等價于:not([attr=value])。
例子說明一下:
HTML代碼
復(fù)制代碼 代碼如下:
<input type="checkbox" name="newsletter" value="Hot Fuzz" />
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />
jQuery 代碼:
復(fù)制代碼 代碼如下:
$("input[name!='newsletter']").attr("checked", true);
結(jié)果:
[ <input type="checkbox" name="accept" value="Evil Plans" checked="true" /> ]
3.*。選擇器:[attribute*=value],匹配給定的屬性是以包含某些值的元素。舉個例子說明一下:
HTML 代碼:
復(fù)制代碼 代碼如下:
<input name="man-news" />
<input name="milkman" />
<input name="letterman2" />
<input name="newmilk" />
jQuery 代碼:
復(fù)制代碼 代碼如下:
$("input[name*='man']")
結(jié)果:
[ <input name="man-news" />, <input name="milkman" />, <input name="letterman2" /> ]
4.@。匹配包含給定屬性的元素。注意,在jQuery 1.3中,前導(dǎo)的@符號已經(jīng)被廢除!如果想要兼容最新版本,只需要簡單去掉@符號即
可。
5.^。選擇器:[attribute^=value],匹配給定的屬性是以某些值開始的元素,下面舉個例子來說明一下:
HTML 代碼:
復(fù)制代碼 代碼如下:
<input name="newsletter" />
<input name="milkman" />
<input name="newsboy" />
jQuery 代碼:
復(fù)制代碼 代碼如下:
$("input[name^='news']")
結(jié)果:
[ <input name="newsletter" />, <input name="newsboy" /> ]
6 獲取指定屬性且設(shè)定值中有指定字符串的元素
HTML 代碼:
復(fù)制代碼 代碼如下:
<input type="checkbox" name="newsletter" value="Hot Fuzz"/>
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />
jQuery代碼:
復(fù)制代碼 代碼如下:
$("input[name$='letter'][value$='zz']").attr("checked","true");支持多條件操作
當(dāng)然了,也可以根據(jù)id屬性或其他屬性來獲取,如$("input[id=id1]").css("color",red);
在jquery中,當(dāng)使用$(”input[name='metaId']“).val()不能直接獲得被選擇的radio的值,只是獲得 radio標(biāo)簽的第一個值,這可能jquery使用xpath語言了進行查找有關(guān),而我們通常是想獲得被選中的radio的值,有以下幾種方法:
1,使用$(”input[name='metaId']:checked”).val()獲得 //name代表radio中name屬性名
2,使用$(”:radio:checked”).val()獲得 //限制頁面只有一組radio標(biāo)簽
相關(guān)文章
jQuery ajax仿Google自動提示SearchSuggess功能示例
這篇文章主要介紹了jQuery ajax仿Google自動提示SearchSuggess功能,結(jié)合實例形式較為詳細的分析了jQuery結(jié)合ajax與.net后臺調(diào)用sql數(shù)據(jù)庫實現(xiàn)搜索自動提示相關(guān)操作技巧,需要的朋友可以參考下2019-03-03如何書寫高質(zhì)量jQuery代碼(使用jquery性能問題)
眾所周知,jQuery現(xiàn)在已經(jīng)非常流行,百度新首頁中也已經(jīng)開始使用jQuery,今天總結(jié)下怎么書寫更好的jQuery代碼使jQuery代碼更好、更快的執(zhí)行,希望本篇jQuery教程一改大家以前不合理的做法2014-06-06Jquery和Js獲得元素標(biāo)簽名稱的方法總結(jié)
下面小編就為大家?guī)硪黄狫query和Js獲得元素標(biāo)簽名稱的方法總結(jié)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-10-10jquery改變disabled的boolean狀態(tài)的三種方法
改變disabled的boolean狀態(tài),下面為大家介紹三種比較不錯的方法,大家可以參考下2013-12-12jQuery Mobile頁面跳轉(zhuǎn)后未加載外部JS原因分析及解決
Web開發(fā)進行頁面跳轉(zhuǎn)時在pageB中引用的JS并未成功運行,針對這個問題本文給予了詳細的解決方法,感興趣的你可以參考下哈,希望可以幫助到你2013-03-03