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. hiberante学习笔记

    1.配置文件(hibernate映射文件): 让hibernate知道该怎么样去load,store持久化对象: 1.1 数据库忌讳的字段名 1) User 2) index 2.数据库表中一对多,多 ...

  2. Error: failed to fetch platform android

    在使用ionic创建项目后,需要添加平台,运行如下命令添加Android平台时: ionic platform add android 1 出现错误: Error: failed to fetch p ...

  3. 剑指Offer 跳台阶

    题目描述 一只青蛙一次可以跳上1级台阶,也可以跳上2级.求该青蛙跳上一个n级的台阶总共有多少种跳法.   解题思路: f(n)=f(n-1)+f(n-2); f(1)=1,f(2)=2;   AC代码 ...

  4. django formset bug?

    碰到了一个郁闷的问题,修改inlineformset时,全部删掉子表,再新增一行时,报错. 背景: 用django配合jq做动态表格,实现用js动态添加/删除行,并通过inlineformset更新到 ...

  5. 如何用js控件div的滚动条,让它在内容更新时自动滚到底部?

    三种控制DIV内容滚动的方法: 方法一:使用锚标记要滚动到的位置,然后通过click方法模拟点击滚动到锚所在位置 <script language="javascript1.2&quo ...

  6. saltstack/salt的state.sls的使用

    SLS(代表SaLt State文件)是Salt State系统的核心.SLS描述了系统的目标状态,由格式简单的数据构成.这经常被称作配置管理 首先,在master上面定义salt的主目录,默认是在/ ...

  7. 【Other】最近正在看的

    待看: https://my.oschina.net/yunfound/blog/141222 https://www.zhihu.com/question/22925358 http://study ...

  8. Repository设计模式

    definition: 通过用来访问领域对象的一个类似集合的接口,在领域与数据映射层之间进行协调. advantage: 使用该模式的最大好处就是将领域模型从客户代码和数据映射层之间解耦出来. 理解内 ...

  9. MVC Return View() 和 Return PartialView()的区别

    分部视图在action中返回一定要用PartialView(),而不要偷懒使用View(),因为,如果你使用View()渲染视图,系统会认为你是一个标准视图,会为你加个默认的母板页(Layout),除 ...

  10. java微信接口之——获取access_token

    本文转自http://www.cnblogs.com/always-online/category/598553.html 一.微信获取access_token接口简介 1.请求:该请求是GET方式请 ...