快捷導(dǎo)航

JQuery中根據(jù)屬性或?qū)傩灾但@得元素(6種情況獲取方法)

更新時(shí)間：2013年01月17日 11:00:24 作者：

根據(jù)屬性或?qū)傩灾但@得元素本文介紹六種不同的情況獲取方法,有需要的朋友可以參考下

根據(jù)屬性獲得元素

1.比如要獲取頁(yè)面p標(biāo)簽中屬性有id的元素

$("p[id]").css("color","red");

根據(jù)屬性值獲得元素
1.$。在jQuery 中$("<span>")，這個(gè)語法等同于$(document.createElement("span")) ，這是一種用法，在選擇元素的時(shí)候還會(huì)這樣子的用：[attribute$=value]，匹配給定的屬性是以某些值結(jié)尾的元素。下面舉個(gè)例子來說明一下：
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]，匹配所有不含有指定的屬性，或者屬性不等于特定值的元素，此選擇器等價(jià)于: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]，匹配給定的屬性是以包含某些值的元素。舉個(gè)例子說明一下：
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)的@符號(hào)已經(jīng)被廢除！如果想要兼容最新版本，只需要簡(jiǎn)單去掉@符號(hào)即
可。

5.^。選擇器：[attribute^=value]，匹配給定的屬性是以某些值開始的元素，下面舉個(gè)例子來說明一下：
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)簽的第一個(gè)值，這可能jquery使用xpath語言了進(jìn)行查找有關(guān)，而我們通常是想獲得被選中的radio的值，有以下幾種方法：
1，使用$(”input[name='metaId']:checked”).val()獲得 //name代表radio中name屬性名
2，使用$(”:radio:checked”).val()獲得 //限制頁(yè)面只有一組radio標(biāo)簽

您可能感興趣的文章: