jquery 属性选择器
href也是属性经常用到
a:has(img)[href$=".gif"]//a中包含img,href以.gif结尾的。
[name|=”value”] 包含 :单独的 value , 或者是 “-” 相连的
<a href=”example.html” hreflang=”en”>Some text</a>
<a href=”example.html” hreflang=”en-UK”>Some other text</a>
<a href=”example.html” hreflang=”english”>will not be outlined</a>
$(‘a[hreflang|=”en”]’).css(‘border’,’3px dotted green’);
第一第二个才是。
————————————-
[name*=”value”]
<input name=”man-news” />
<input name=”milkman” />
<input name=”letterman2″ />
<input name=”newmilk” />
<script>$(‘input[name*=”man”]’).val(‘has man in it!’);</script>
前面3个input包含了man的。//所有包含man的都选择。
—————————————–
[name~=”value”]
<!DOCTYPE html>
<html>
<head>
<script src=”http://code.jquery.com/jquery-latest.js”></script>
</head>
<body>
<input name=”man-news” />
<input name=”milk man” />
<input name=”letterman2″ />
<input name=”newmilk” />
<script>$(‘input[name~=”man”]’).val(‘mr. man is in it!’);</script>
</body>
</html>
用空格分隔的元素。第二个。
—————————————–
[attribute$=”value”]
<!DOCTYPE html>
<html>
<head>
<script src=”http://code.jquery.com/jquery-latest.js”></script>
</head>
<body>
<input name=”newsletter” />
<input name=”milkman” />
<input name=”jobletter” />
<script>$(‘input[name$=”letter”]’).val(‘a letter’);</script>
</body>
</html>
以name为letter结尾的。也是用的最多的。
——————————————
[attribute=”value”] 完全匹配
—————————————-
[attribute!=”value”] 和上面相反
————————————
[attribute^=”value”]
<input name=”newsletter” />
<input name=”milkman” />
<input name=”newsboy” />
<script>$(‘input[name^=”news”]’).val(‘news here!’);</script>
=左边,自己理解。