jquery选择器之属性选择器
生活随笔
收集整理的這篇文章主要介紹了
jquery选择器之属性选择器
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
[attribute] ? 匹配指定屬性名的所有元素
[attribute=value] 匹配給定的屬性名是某個特定值的屬性
[attribute!=value]?匹配給定的屬性名不是某個特定值的屬性
[attribute^=value] 以開頭
[attribute$=value] 以結尾
[attribue*=value] 給定的屬性包含某些值的元素
[selector1][selector2][selectorN] 復合選擇器,需要同是滿足所有條件
HTML示例代碼
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title></title> </head> <body><!--HTML區域--><h1>第一個標題</h1><div class="nav-2014"><div class="w"><div class="w-spacer"></div><div class="categorys"><div class="dt">家用電器分類</div><div class="dp">家用電器價格</div></div><span class="hr"></span><div class="navitems-2014"><div id="treasure"></div><span class="clr"></span><span class="chr"></span>男:<input type="checkbox" checked="checked" value="nan">女:<input type="checkbox" value="nv"></div></div></div><h2>第二個標題</h2><div id="electronic"><div id="firstScreen">1<div class="w">2</div></div><ul><li class="ui-switch-curr">第一</li><li class="ui-switch-item"></li><li class="ui-switch-next">第三</li><li class="ui-switch-sub">第四</li></ul><ul><li class="lizi_ws_fruit" name="zhuang_guo">梨</li><li class="ws_pingguo_fruit" name="zhuan_wang">蘋果</li><li id="elpsq" name="zhuang_dang"></li></ul><div class="secord_screen"><div></div></div><div class="third_screen"></div></div></body> </html>jquery代碼
<script src="jquery-3.1.0.js"></script><script> // 匹配所有包含id屬性的div標簽$("div[id]") // 在所有div標簽中查找id屬性為electronic的元素$("div[id=electronic]")$("div[id!=electronic]") // 查找所有li標簽中屬性class值以ui-swithc開頭的元素$("li[class^=ui-switch]") // 查找所有li標簽中屬性class的值以fruit結尾的元素$("li[class$=fruit]") // 查找所有li標簽中屬性class的值包含ws的元素$("li[class*=ws]") // 查找所有li標簽中屬性中有id且有name,且name的值以guo結尾的元素$("li[class][name$=guo]")console.log(objs)</script>
?
轉載于:https://www.cnblogs.com/kongzhagen/p/6193547.html
總結
以上是生活随笔為你收集整理的jquery选择器之属性选择器的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: iOS - UIControl
- 下一篇: maven 学习---Maven本地资源