过滤选择器

4、属性过滤器

查找所有含有 id 属性的 div 元素
$(document).ready(function(){
$("div[id]").css("color","red");
});
<body>
<div>test1</div>
<div id="d">test2</div>
</body>
查找所有name是qin的input并选中
$(document).ready(function(){
$("input[name='qin']").attr("checked","true");
});
</script>
查找所有name不是qin的input并选中
$(document).ready(function(){
$("input[name!='qin']").attr("checked","true");
});
查找所有name以qin开头的input
$(document).ready(function(){
$("input[name^='qin']").attr("checked","true");
});
查找所有name以lol结尾的input并选中
$(document).ready(function(){
$("input[name$='lol']").attr("checked","true");
});
查找所有name包含o的input并选中
$(document).ready(function(){
$("input[name*='o']").attr("checked","true");
});
查找所有含有id属性的并且name的结尾是e的input并选中
$(document).ready(function(){
$("input[id][name$='e']").attr("checked","true");
});

<body>
<input type="checkbox" name="qin" value="Hot Fuzz" />1
<input type="checkbox" name="yilol" value="Cold Fusion" />2
<input type="checkbox" name="love" value="Evil Plans" />3
</body>

5.子元素过滤选择器

匹配ul的第二个li （索引从1开始）
$(document).ready(function(){
$("ul li:nth-child(2)").css("color","red");
});
只匹配ul第1个元素
$(document).ready(function(){
$("ul li:first-child").css("color","red");
});
匹配ul最后一个li
$(document).ready(function(){
$("ul li:last-child").css("color","red");
});
匹配ul中是唯一的li
$(document).ready(function(){
$("ul li:only-child").css("color","red");
});

<body>
<div>test1</div>
<div id="d">test2</div>
<input type="checkbox" name="qin" value="Hot Fuzz" />1
<input type="checkbox" name="yilol" value="Cold Fusion" />2
<input type="checkbox" name="love" value="Evil Plans" id="test" />3
<ul>
<li>qin</li>
<li>yi</li>
<li>test</li>
</ul>
<ul>
<li>only</li>
</ul>
</body>

6.表单对象属性过滤选择器

匹配所有可用的input元素
$(document).ready(function(){
$("input:enabled").attr("checked","true");
});
匹配所有不可用的input元素
$(document).ready(function(){
$("input:disabled").attr("checked","true");
});
匹配所有选中的input元素（(复选框、单选框等，不包括select中的option)）
$(document).ready(function(){
$("input:checked").attr("checked","true");
});
匹配所有选中的option元素（下拉列表）
$(document).ready(function(){
$("select option:selected").css("background","#bfa");
});

<body>
<input type="checkbox" name="qin" value="Hot Fuzz" />1
<input type="checkbox" name="yilol" value="Cold Fusion" />2
<input type="checkbox" name="love" value="Evil Plans" id="test" />3
<input type="checkbox" name="email" disabled="disabled" />disabled
<select>
<option value="1" >qin</option>
<option value="2" selected="selected">yi</option>
<option>test</option>
</select>
</body>

7.7.表单选择器

匹配所有input类型：
$(document).ready(function(){
$(":input").css("background","#bfa");
});
匹配所有文本框：
$(document).ready(function(){
$(":text").css("background","#bfa");
});
匹配所有密码框：
$(document).ready(function(){
$(":password").css("background","#bfa");
});
匹配所有单选按钮：
$(document).ready(function(){
$(":radio").css("background","#bfa");
});
匹配所有复选框：
$(document).ready(function(){
$(":checkbox").css("background","#bfa");
});
匹配所有提交按钮：
$(document).ready(function(){
$(":submit").css("background","#bfa");
});

<body>
<div>test1</div>
<div id="d">test2</div>
<input type="button" value="Input Button"/>
<input type="checkbox" />
<input type="password" />
<input type="radio" />
<input type="reset" />
<input type="text" />
<input type="submit" />
</body>

Jquery选择器（三）的更多相关文章

  1. jquery选择器(三)-过滤选择器

    一.基本过滤选择器 二.内容过滤选择器 1. 包含文本内容为“text”的元素 2. 含有某个选择器所匹配的父元素 3. 包含有子元素或者文本的父元素 4. 不含有子元素或者文本的父元素 三.可见性过 ...

  2. jQuery（三）之 选择器(基础版)

    对于jQuery的调用,我们一般都会传入参数 html: <div></div> js: console.log($('<a />')); console.log( ...

  3. <三> jQuery 选择器

    jQuery 选择器选择需要应用效果的元素,jQuery 元素选择器和属性选择器允许您通过标签名.属性名或内容对 HTML 元素进行选择.选择器允许您对 HTML 元素组或单个元素进行操作. 元素选择 ...

  4. jQuery选择器和选取方法 http://www.cnblogs.com/MaxIE/p/4078869.html

    我们已经使用了带有简单Css选择器的jQuery选取函数:$().现在是时候深入了解jQuery选择器语法,以及一些提取和扩充选中元素集的方法了. 一.jQuery选择器 在CSS3选择器标淮草案定义 ...

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

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

  6. 深入学习jQuery选择器系列第二篇——过滤选择器之子元素选择器

    × 目录 [1]通用形式 [2]反向形式 [3]首尾元素 [4]唯一元素 前面的话 在上一篇中已经介绍过基础选择器和层级选择器,本文开始介绍过滤选择器.过滤选择器是jQuery选择器中最为庞大也是最为 ...

  7. jQuery-1.9.1源码分析系列（二）jQuery选择器续1

    在分析之前说一点题外话. ownerDocument和 documentElement的区别 ownerDocument是Node对象的一个属性,返回的是某个元素的根节点文档对象:即document对 ...

  8. 我人生中的jQuery选择器

    Jquery选择器 一.Jquery选择器简介 JavaScript只是一种运行于客户端,可以被客户端浏览器解析的一段代码.它和java没有任何关系.JavaScript简称JS.jQuery是对JS ...

  9. jQuery学习笔记(一)jQuery选择器

    目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...

  10. jquery选择器 之 获取父级元素、同级元素、子元素

    jquery选择器 之 获取父级元素.同级元素.子元素 一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 <div id="par_div" ...

随机推荐

  1. DL二（稀疏自编码器 Sparse Autoencoder）

    稀疏自编码器 Sparse Autoencoder 一神经网络(Neural Networks) 1.1 基本术语 神经网络(neural networks) 激活函数(activation func ...

  2. C语言中的位操作（15）--确定log10（N）的整数部分

    本篇文章介绍一个整数的以10为底的对数的整数部分,即对于整数N,求log10(N)整数部分 方法一 : unsigned int v; //32位非0整数 int r; // r保存结果 int t; ...

  3. PE.微PE

    1.老毛桃,大白菜(20180227) ZC:我记得以前 "老毛桃"."大白菜" 之前的版本,在安装好系统之后,是没有捆绑软件的,.现在,老毛桃 安装完系统之后 ...

  4. Hive- Hive 按时间定期插入分区表

    写个shell脚本Hive 按时间定期插入分区表,由于今天统计的是昨天的数据所以日期减一. #!/bin/bash DT=`date -d '-1 day' "+%Y-%m-%d" ...

  5. php: 0跟字符串做比较永远是true。 php大bug。

    php: 0跟字符串做比较永远是true. php大bug. 如: $a = 0; if( $a == 'excel') { echo "yes"; }else{ echo &qu ...

  6. java:类集操作总结

    java:类集操作总结 1.List接口允许有重复的元素,Set接口中不允许有重复的元素 2.ArrayList,和Vector的区别 3.set依靠equals和hashCode区分 4.TreeS ...

  7. unity3D中一些有用的设置

    edit-project setting-time:可以设置fixed update()每一帧执行的时间 timescale:时间流动速度,设置为0则运用了time.deltatime的动画计时器均停 ...

  8. 分布式系统的Raft算法——在失联阶段这个老Leader的任何更新都不能算commit，都回滚，接受新的Leader的新的更新 意味着还是可能丢数据！！！

    过去, Paxos一直是分布式协议的标准,但是Paxos难于理解,更难以实现,Google的分布式锁系统Chubby作为Paxos实现曾经遭遇到很多坑. 来自Stanford的新的分布式协议研究称为R ...

  9. python-管理MySQL之ConfigParser模块

    1.拷贝2.7版本的ConfigParser.py模块支持无值解析 cp /usr/local/src/Python-2.7.5/Lib/ConfigParser.py /usr/lib/python ...

  10. SQL关联查询中on与where

    微信公众号:刺刺刺猬的优雅 前段时间,做一个查询,打算用left join查询存在于A表但不存在于B表记录,但怎么查都不对,原因是把所有filter全部放在了where语句中,因此回头看了资料,记录一 ...