过滤选择器

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. Hive split分割后获取最后一段

    ----------------------------------------- 如果只看解决方法,直接看最后... ---------------------------------------- ...

  2. Oracle的PL_SQL的异常处理

    --什么是异常 --异常是在PL/SQL运行过程中有可能出现的错误. --执行异常的语句 exception when [异常] when --异常输出信息. --Oracle的预定义异常 CASE_ ...

  3. Spark- Spark基本工作原理

    Spark特点: 1.分布式 spark读取数据时是把数据分布式存储到各个节点内存中 2.主要基于内存(少数情况基于磁盘,如shuffle阶段) 所有计算操作,都是针对多个节点上内存的数据,进行并行操 ...

  4. Codeforces 900D Unusual Sequences：记忆化搜索

    题目链接:http://codeforces.com/problemset/problem/900/D 题意: 给定x,y,问你有多少个数列a满足gcd(a[i]) = x 且 ∑(a[i]) = y ...

  5. java:解决eclipse配置Tomcat时找不到server选项

    http://blog.csdn.net/wugangsunny/article/details/25246565 集成Eclipse和Tomcat时找不到server选项: 按照网上的步骤如下: 在 ...

  6. 什么是 Sass 其与SCSS区别是什么？

    Sass 官网上是这样描述 Sass 的: Sass 是一门高于 CSS 的元语言,它能用来清晰地.结构化地描述文件样式,有着比普通 CSS 更加强大的功能. Sass 能够提供更简洁.更优雅的语法, ...

  7. (转)通过汇编语言实现C协程

    转自:http://www.cnblogs.com/sniperHW/archive/2012/06/19/2554574.html 协程的概念就不介绍了,不清楚的同学可以自己google,windo ...

  8. MFC实现COM组件

    一般而言,ATL实现了对COM组件最好的支持,所以不用MFC实现COM组件.但是MFC实际上也是可以实现COM组件的. 一.MFC DLL优点: MFC com组件可以将MFC的类型作为参数进行传递, ...

  9. MFC工程名称与所包含文件名称的关系（工程名可以更改，输出的.dll.exe.lib都以最后工程名命名为准）

    创建MFC应用程序时,可以规定MFC程序的工程名称,假设初始为MFCApp,则此后该应用程序的资源文件名称,继承自CWinApp的那个类,包括.def文件,.odl文件等都会以MFCApp打头. 但是 ...

  10. tbody scroll

    http://jsfiddle.net/hashem/CrSpu/555/