1. 属性过滤选择器

1. $("div[id]")选取有id属性的<div>

2. $("div[title=test]")选取title属性为“test”的<div>,

3. $("div[title!=test]")选取title属性不为“test”的<div>

4. $(“div[id*=div]”)选取给定的属性是以包含某些值的元素 还可以选择开头、结束、包含等,条件还可以复合。(*)

2.表单对象选择器(过滤器):

1. $("#form1:enabled")选取id为form1的表单内所有启用的元素

2. $("#form1:disabled")选取id为form1的表单内所有禁用的元素

3. $("input:checked")选取所有选中的元素(Radio、CheckBox)

4. $("select option:selected")选取所有选中的选项元素(下拉列表)

3.表单选择器

$(":input")选取所有<input>、<textarea>、<select>和<button>元素。

$(":text")选取所有单行文本框,等价于$("input[type=text]")

$(":password")选取所有密码框。同理还有:radio、:checkbox、:submit、:image、:reset、:button、:file、:hidden。

属性过滤选择器:


<body>
<input id="t1" type="text"/><br />
<input id="t2" type="text"/><br />
<input id="t3" type="text"/><br />
<input id="t4" type="text" /><br />
<input type="text" /><br />
<input type="text" /><br />
<input id="btn1" type="button" value="click1" /><br />
<input id="btn2" type="button" value="click2" /><br />
<input type="button" value="click3" /><br />
<input type="button" value="click4" /><br />
</body>

1. $("div[id]")选取有id属性的<div>


2. $("div[title=test]")选取title属性为“test”的<div>,JQuery中没有对getElementsByName进行封装,用$("input[name=abc]")

3. $("div[title!=test]")选取title属性不为“test”的<div>

4. $(“div[id*=div]”)选取给定的属性是以包含某些值的元素

还可以选择开头、结束、包含等,条件还可以复合。(*)

表单对象选择器(过滤器):


1. $("#form1:enabled")选取id为form1的表单内所有启用的元素

2. $("#form1:disabled")选取id为form1的表单内所有禁用的元素

3. $("input:checked")选取所有选中的元素(Radio、CheckBox)

4. $("select option:selected")选取所有选中的选项元素(下拉列表)

也可以写为

////查找所选的checkbox
$("input[value=checked]").click(function () {
var $v = $("input[type=checkbox]:checked");
for (var i = 0; i < $v.length; i++) {
var v = $v[i];//转换为dom
alert(v.value);
}
})

表单选择器


$(":input")选取所有<input>、<textarea>、<select>和<button>元素。和$("input")不一样, $("input")只获得<input>
$(":text")选取所有单行文本框,等价于$("input[type=text]")

$(":password")选取所有密码框。同理还有:radio、:checkbox、:submit、:image、:reset、:button、:file、:hidden。

案例:歌曲选择,实现全选、反选


jQuery – 6.选择器的更多相关文章

  1. jQuery 的选择器常用的元素查找方法

    jQuery 的选择器常用的元素查找方法 基本选择器: $("#myELement")    选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myE ...

  2. HTML 学习笔记 JQuery(选择器)

    学习前端也有一段时间了,今天终于进入到JQuery阶段了,对于新手来讲,JQuery的选择器类型之多 功能之强大实在不是一天两天能够记得完的.现在,就采用边学边记录的方式.以后要是忘了的话,也有一个地 ...

  3. jQuery的选择器中的通配符总结

    1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='code']&quo ...

  4. JQuery 层次选择器

    <!DOCTYPE HTML> <html> <head> <title> 使用jQuery层次选择器 </title> <scrip ...

  5. jQuery过滤选择器

    //基本过滤器$('li:first').css('background','#ccc');//第一个元素$('li:last').css('background','red');//最后一个元素$( ...

  6. jquery相对选择器,又叫context选择器,上下文选择器;find()与children()区别

    jquery相对选择器有两个参数,jQuery函数的第二个参数可以指定DOM元素的搜索范围(即以第二个参数指定的内容为容器查找指定元素). 第二个参数的不同的类型,对应的用法如下表所示. 类型 用法 ...

  7. jQuery之选择器

    jQuery元素选择器和属性选择器允许您通过标签名.属性名或内容对 HTML 元素进行选择和操作,而在 HTML DOM中,选择器可以对DOM元素组或单个DOM 节点进行操作.通俗点说,选择器的作用就 ...

  8. 关于jquery ID选择器的一点看法

    最近看到一道前端面试题: 请优化selector写法:$(".foo div#bar:eq(0)") 我给出的答案会是: 1. $("#bar") 2.  $( ...

  9. jQuery的选择器中的通配符[id^='code'] 【转】

    JQuery 1.选择器 (1)通配符: $("input[id^='code']");//id属性以code开始的所有input标签 $("input[id$='cod ...

  10. jquery下 选择器整理

    jQuery 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法 $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个 ...

随机推荐

  1. [BZOJ1901]Zju2112 Dynamic Rankings

    [BZOJ1901]Zju2112 Dynamic Rankings 试题描述 给定一个含有n个数的序列a[1],a[2],a[3]--a[n],程序必须回答这样的询问:对于给定的i,j,k,在a[i ...

  2. createElement() 创建元素 appendChild()添加元素

    Javascript window 对象的document.createElement() 方法.语法及其使用. 1.方法 创建一个新的html元素对象,并可返回一个Element 对象,新创建的El ...

  3. Windows8笔记

    一.WIN8 硬盘变为可弹出设备 如果电脑使用的是nforce芯片组的主板和串口硬盘.在系统中安装好所有的硬件驱动程序后,会出现这种情况.这是nforce芯片组在安装了IDE-SW主板驱动以后,系统会 ...

  4. Qt5.5.1 学习笔记

    添加图标(.pro): RC_ICONS = 1.ico    RC_FILE = 1.rc 新建 1.rc 内容:IDI_ICON1 ICON "1.ico" 支持c++11(. ...

  5. windows下nodejs常见错误

    1.express-session express-session deprecated undefined resave option; provide resave option auth_s e ...

  6. Ubuntu14.04安装intel集显驱动

    Ubuntu14.04安装intel集显驱动 标签(空格分隔): ubuntu linux 驱动安装 1.查看本机显卡型号 使用lspci命令来获取PCI接口硬件信息 o@o-pc:~$ lspci ...

  7. composer 的使用

    composer是php包管理工具,非常好用!许多框架,例如zendframework都可以用它来安装. 使用起来其实是很简单的.以下以windowns操作系统为例: 把php添加到系统环境变量.(网 ...

  8. 搭建JavaWeb服务器

    JDK安装可以参考 http://www.cnblogs.com/a2211009/p/4265225.html Tomcat安装可参考 1.由于服务器配置比较低综合考虑,选择ubuntu系统进行搭建 ...

  9. 【架构】How To Use HAProxy to Set Up MySQL Load Balancing

    How To Use HAProxy to Set Up MySQL Load Balancing Dec  2, 2013 MySQL, Scaling, Server Optimization U ...

  10. Fraction to Recurring Decimal

    Given two integers representing the numerator and denominator of a fraction, return the fraction in ...