[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>

  

jquery选择器之属性选择器的更多相关文章

  1. jQuery选择器之属性选择器Demo

    测试代码: 06-属性选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  2. 深入学习jQuery选择器系列第四篇——过滤选择器之属性选择器

    × 目录 [1]简单属性 [2]具体属性 [3]条件属性 前面的话 属性过滤选择器的过滤规则是通过元素的属性来获取相应的元素,对应于CSS中的属性选择器.属性过滤选择器可分为简单属性选择器.具体属性选 ...

  3. jQuery选择器之属性筛选选择器

    在这么多属性选择器中[attr="value"]和[attr*="value"]是最实用的 [attr="value"]能帮我们定位不同类型 ...

  4. jquery选择器之属性过滤选择器

    <style type="text/css"> /*高亮显示*/ .highlight{ background-color: gray } </style> ...

  5. jquery选择器之属性过滤选择器详解

    代码如下: <style type="text/css">  /*高亮显示*/  .highlight{       } </style> 复制代码代码如下 ...

  6. 晨读笔记:CSS3选择器之属性选择器

    一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...

  7. CSS3选择器之属性选择器

    一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...

  8. html 选择器之属性选择器

    属性选择器的主要作用个人的理解就是对带有指定属性的元素设置css样式. 使用css3的属性选择器,可以指定元素的某个属性,也可以指定某个属性和这个属性所对应的值. css3的属性选择器主要包括下面几种 ...

  9. jQuery选择器之id选择器

    页面的任何操作都需要节点的支撑,开发者如果快速高效的找到指定的节点也是前端开发中的一个重点.jQuery提供了一系列的选择器帮助开发者达到这一目的,让开发者可以更少的处理复杂选择过程与性能优化,更多专 ...

随机推荐

  1. archaism remains

    Time past cannot be called back again.  时间不能倒流. Time tries all.  路遥知马力,日久见人心.  Tit for tat is fair p ...

  2. 电脑的f5刷新不了

    新买的电脑,f5刷新不了页面,网上查了后发现是fn功能键的原因.同时fn+f5即可刷新.可是依然感觉好别扭... 按下fn+esc,再只按f5,就可以刷新页面了.神奇...

  3. tiny_cnn代码阅读(2)

    上一篇讲了mse函数 , 这次gradient_descent_levenberg_marquardt @see ${root}/tiny_cnn/optimizer/optimizer.h 这个函数 ...

  4. DES MAC PIN HEX

    /* void DesEncrypt( UCHAR * auchInput,UCHAR * auchKey,UCHAR * auchOutput=NULL); Function: DesEncrypt ...

  5. Effective Java阅读笔记——引言

    “我很希望10年前就拥有这本书.可能有人认为我不需要任何Java方面的书籍,但是我需要这本书.” ——Java之父 James Gosling 在图书馆找到这本java著作时,首先看到了这句话.   ...

  6. [转]CSS,font-family,常用网页字体

    http://www.zreading.cn/ican/2014/10/css-font-family/ CSS,font-family,好看常用的中文字体 2014-10-14 例1(小米米官网): ...

  7. sonar-gerrit-plugin-2.2.0 安装

    这是一个很新的插件国内使用的用户还是很少的,公司有需要才花了一段时间去研究. 作用:在 code review的时候可以将sonar的检测结果直接集成返回.帮助po对code 进行review. 请严 ...

  8. Dispatcher.Invoke方法

    前一篇小猪分享过在WPF中简单的使用BackgroundWorker完成多线程操作!在那篇中小猪利用了BackgroundWorker组件对耗时比较多的操作放在了单独的BackgroundWorker ...

  9. JavaScript 用法

    JavaScript 用法 HTML 中的脚本必须位于 <script> 与 </script> 标签之间. 脚本可被放置在 HTML 页面的 <body> 和 & ...

  10. Java String.split()用法小结

    在java.lang包中有String.split()方法,返回是一个数组 我在应用中用到一些,给大家总结一下,仅供大家参考: 1.如果用“.”作为分隔的话,必须是如下写法,String.split( ...