博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery的选择器
阅读量:4673 次
发布时间:2019-06-09

本文共 1236 字,大约阅读时间需要 4 分钟。

     首先要说的是,浏览器显示的是DOM节点树而非文档,所以才可以通过对DOM的操作来改变结构、行为、样式等东西。

     其次,要进行以上的行为首先要选择好要素吧,但是原生的方法名字很长,时间一长就让人就得很繁琐,效率低下;所以捡各便宜,使用jQuery可以轻松做好这件事。

     jQuery中的选择器很多都与css中是一致的,绝大部分可以直接用,毫无问题。下面就总结一下,以下内容总结于《锋利的JQuery》。

 

     主要是4类:基本选择器、层次选择器、过滤选择器、表单选择器

    1、基本选择器。需要实现基本的选择。*(通配各元素)、ID选择器、类选择器、普通的元素选择、以及它们的组合。

    2、层次选择器。有时后我们要有层次、位置的需求,这时候可使用层次选择器。很简单a b,(a含的所有b,不只是子元素);a > b(a的直接子元素);a + b(a直接相邻的兄弟元素);a ~ b(a 同辈的后面的b,不含a);

    3、过滤选择器。有时后需要对得到的进一步筛选缩小范围。

          a.基本过滤。:first  :last  :not() :eq()  :odd  :even   :lt()   :gt()   :header   :focus  :animated ,这些事基于得到的元素集合的基础上,可以当做元素们在数 组               中,那这是当然索引从0开始了。例如::odd表示的是在数组中的奇数,实际上可能是物理上的偶数。比如在数组中索引为0,则实际是第一个元素。

          b.内容过滤: :contains()依据包含的文本 ,:has()依据是否有某个元素 ,:parent有文本或子元素,:empty没有文本或是子元素。来筛选。

          c.属性过滤。规则与css中属性选择器同,不再说明。

          d、子元素过滤;:nth-child() \ :first-child\:last-child\:only-child.  依据的是实际物理上的,元素在父元素中的情况决定。例如div h2:first-child,选择div中的第一             h2,若是有多个div下有h2,则会选择多个h2.

          e、可见性过滤。:hidden,:visible.  :hidden会选中<input type="hidden" />,属性opacity:hidden,display:none;三种情况。

          f、表单过滤。:enabled\disabled\selected\checked.

     4、表单选择器。:input  :text :password :radio  :submit  :image :reset :file   :hidden。

    使用中,特别是过滤选择器,注意一般是不加空格的,加空格表示的是后代,从而可能有区别的。

    当然可以使用插件或是其他函数来快速提供的选择器来快速选择对应的元素,现在大多数浏览器也支持querySelectorAll().

 

 

 

    

转载于:https://www.cnblogs.com/hustliliangmin/p/6627760.html

你可能感兴趣的文章
pl sql练习(2)
查看>>
Problem B: 判断回文字符串
查看>>
谷歌浏览器,添加默认搜索引擎的搜索地址
查看>>
数据结构化与保存
查看>>
C# .net 获取程序运行的路径的几种方法
查看>>
为什么需要Docker?
查看>>
国内5家云服务厂商 HTTPS 安全性测试横向对比
查看>>
how to control project
查看>>
转 python新手容易犯的6个错误
查看>>
第四节 -- 列表
查看>>
Python入门学习笔记4:他人的博客及他人的学习思路
查看>>
webstorm里直接调用命令行
查看>>
关联规则算法之FP growth算法
查看>>
对数组序列进行洗牌
查看>>
决策树
查看>>
团队作业
查看>>
如何避免在简单业务逻辑上面的细节上面出错
查看>>
win7,Ubuntu 12.04 双系统修改启动项顺序三方法
查看>>
python--列表推导式和生成表达式
查看>>
P - Psychos in a Line 单调队列
查看>>