jQuery常用选择器总结:

  我们都知道jQuery是JavaScript(JS)的框架,它的语法简单使用方便,被广大开发人员青睐。现在我就它常用的并且十分强大的选择器的方式,做一个总结。鉴于它的选择器方式众多,我就自己平时工作之中所遇到的常见的方式做一个总结。

  一,元素查找方式:

    1. $("#myElement")    选择id为myElement的元素,因为id在使用中是唯一的,所以这样的选择也是指定的不变的。
    2. $("div")    选择所有的div标签元素,返回div数组。
    3. $(".myClass")    选择class名为myClass所有的css标签元素。
    4. $("*")    选择文档中的所有元素,也可以运用联合选择方式进行选择,例如:$("#myElement,div,.myClass")。

  二,层叠选择器:

    1. $("form input")    选择所有inform元素下的input元素。
    2. $("#main > *")    选择id为main元素下的所有子元素。
    3. $("label + input")    选择所有label元素的下一个input元素节点。
    4. $("#pre ~ div")    同胞选择器,选择id为pre元素下的所有属于同一个父元素的div标签。

  三,基本过滤选择器:

    1. $("tr:first")    选择tr元素的第一个节点。
    2. $("tr:last")    选择tr元素的最后一个节点。
    3. $("input:not(:checked) + span")   过滤掉checked选择器的所有的input元素。
    4. $("tr:even")   选择所有的tr元素的第0,2,4,.....个元素。
    5. $("tr:odd")   选择所有的tr元素的第1,3,5,......个元素。
    6. $("td:eq(2)")   选择所有的td元素中序号为二的那个td元素。
    7. $("tr:get(4)")   选择所有的td元素中序号大于4的那些td元素。
    8. $("tr:ll(4)")   选择所有的td元素中序号小于4的那些td元素。

  四,表单过滤选择器:

    1. $(":input")   选择所有的表单输入元素,包括input,textarea,select,button。
    2. $(":text")   选择所有的text input元素。
    3. $(":input")   $(":password")    选择所有的password input元素。
    4. $(":radio")    选择所有的radio input元素。
    5. $(":checkbox")    选择所有的checkbox input元素。
    6. $(":submit")    选择所有的submit input元素。
    7. $(":image")    选择所有的image input元素。
    8. $(":reset")    选择所有的reset input元素。
    9. $(":button")    选择所有的button input元素。
    10. $(":file")    选择所有的file input元素。
    11. $(":hidden")    选择所有的类型为hidden的input元素或者表单隐藏域。
    12. $(":enabled")    选择所有的可操作的表单元素。
    13. $(":disabled")    选择所有的不可操作的表单元素。
    14. $(":checked")    选择所有的被checked的表单元素。
    15. $("select option:select")    选择所有的select的子元素中被select的元素。

  jQuery的选择器中层叠过滤先择器是常用的并且复杂的选择器之一,在这里就没有大篇幅的去总结了,因为就上面的各种选择器方式,运用熟悉了,对开发来说都是足够了的。

jQuery常用选择器总结的更多相关文章

  1. jquery 常用选择器和方法以及遍历(超详细)

    jQuery 常用选择器和和方法 学习总结 一.JQuery 介绍 1. 什么是 jQuery 2. jQuery 版本介绍 3. jQuery 文件介绍 二.jQuery 对象 1. jQuery ...

  2. jquery常用选择器(转)

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

  3. js和jQuery常用选择器

    笔者觉得js是前台基础中的基础,而其选择器则是js基础中的基础,因长期使用框架导致js生疏,所有查资料,回顾一下js的常用选择器: 1.document.getElementById("id ...

  4. jquery 常用选择器基础语法学习

    siblings方法的常用应用场景:选中高亮 实现代码 <!DOCTYPE html> <html> <head> <meta charset="U ...

  5. jquery常用选择器和常用方法

    基本选择器 $(”#myDiv”) //匹配唯一的具有此id值的元素 $(”div”) //匹配指定名称的所有元素 $(”.myClass”) //匹配具有此class样式值的所有元素 $(”*”) ...

  6. jquery常用选择器

    1.数字性过滤 $("tr:first")               //选择所有tr元素的第一个 $("tr:last")                / ...

  7. jquery及jquery常用选择器使用

    本文为博主原创,未经允许不得转载: 1.jquery强大之处:   容易上手,强大的选择器,解决浏览器的兼容   完善的时间机制,出色的ajax封装,丰富的ui    2.jquery是一个javas ...

  8. jquery 常用选择器 回顾 ajax() parent() parents() children() siblings() find() eq() has() filter() next()

    1. $.ajax() ajax 本身是异步操作,当需要将 异步 改为 同步时: async: false 2.parent()  父级元素  和  parents() 祖先元素 的区别 parent ...

  9. jQuery常用选择器汇总

    一.基本选择器 <body> <div> <div id="div1"> aaaaaaaaaaa</div> <div cla ...

随机推荐

  1. 20175126《Java程序设计》第六周学习总结

    # 20175126 2016-2017-2 <Java程序设计>第五周学习总结 ## 教材学习内容总结 - 本周学习方式主要为手动敲代码并理解内容学习. - 学习内容为教材第七章第十章, ...

  2. LAB7 REST

    r需要初始化才能赋值. 不要盲目抄doGet方法,要理解题目的意思

  3. [leetcode]61. Rotate List旋转链表

    Given a linked list, rotate the list to the right by k places, where k is non-negative. Example 1: I ...

  4. 如何用命令将本地项目上传到git[z]

    1.(先进入项目文件夹)通过命令 git init 把这个目录变成git可以管理的仓库 git init 2.把文件添加到版本库中,使用命令 git add .添加到暂存区里面去,不要忘记后面的小数点 ...

  5. NOIP2018游记-退役之战

    \(Day\ 0\) 从火车站下来坐地铁\(1\)小时,再乘公交车到酒店,还要帮队里一个断腿大佬搬东西,累死我了.. 到酒店就快\(5\)点了,想打个牌也没时间. 酒店的房间很不错,空间大又干净,后来 ...

  6. create-react-app创建项目并用git上传至GitHub及展示预览效果

    1.在本地中创建一个项目所在的文件夹 2.npm -g create-react-app 3.在此文件夹下 create-react-app react-demo (项目名) 4.cd react-d ...

  7. [精华][推荐]CAS SSO单点登录服务端客户端学习

    1.通过下载稳定版本的方式下载cas的相关源码包,如下: 直接选择4.2.1的稳定代码即可 2.我们项目中的版本版本使用maven apereo远程库去下载 通过远程maven库下载cas-serve ...

  8. 通过HashSet达到对象集去重的实现(jdk1.8)

    通过HashSet达到对象集去重的实现(jdk1.8) public class Contract { private String contractId; private String contra ...

  9. Appium+Python自动化 2 定位元素方式

    1.找到 Android SDK安装路径tools 下面的 uiautomatorviewer.bat,如下截图 2.点击uiautomatorviewer.bat进行启动,左上角一共四个按钮,作用分 ...

  10. angular点击查看更多(简单demo)

    今天来跟大家分享一个小的demo,一般网页浏览到底部的时候会有一个点击加载更多的按钮,之前一直纠结怎么写这个,今天学习angular时发现可以用组件来实现这么一个小的效果,大家有兴趣的话可以看一下. ...