对jQuary选择器的全面总结


Posted in Javascript onJune 20, 2016

jQuary基础选择器

$("div*")获取div下面的所有元素

$(".red,.green").html("怎么") // 需要注意的是要把两个选择前写在同一个引号内 (需要同时选择多个选择器的时候用)

$("ance desc") //ancestor祖先选择器 descendant子孙选择器

$(“parent > child”) //只包含子辈选择器 不包含孙辈选择器

$(“prev + next”) // "+"表示一种上下级的关系,prev元素最紧邻的下一个元素是next,选择器返回的并且只返回唯一的元素 

$("p+label").css("background-color","red"); 给紧邻着的邻居加个背景颜色

$(“prev ~siblings”) //获取prev后面所有的相邻元素(相邻只包含同一个父级元素内的)

jQuary的过滤性选择器

:first $(“li:first”)获得一组相同标签中的第一个元素 是一个元素不是一个集合

:last 最后一个元素

:eq(index) 按照索引查找元素 

$("li:eq(2)") 索引从零开始 获取li标签中的第三个元素

:contains(text) 按照内容查找元素 

$(“li:contains('张三')”) 获取到内容包含张三的所有li元素 张三为什么必须加单引号呢?因为它是一个字符串,而不是一个变量,所以不加单或双引号的话是会报错的。

:has(slector) 按照元素获取 

$("li:has('p')")获取了包含<p>元素的全部<li>元素

:hidden 获取全部不可见的元素,这些不可见的元素中包括type属性值为hidden的元素。$("li:hidden")获取li 下面所有display:none的元素或者是hidden的元素

:visible 获取的是全部可见的元素,只要不将元素的display属性值设置为“none”,都可以通过该选择器获取。 

$("p:visible")获取可见的<p>元素

[attribute=value] 获取属性名等于属性值的元素 

$("li[title='小超人']") 加了li是确定了范围如果不加li则选择的是全部的

[attribute!=value] 获取属性名不等于属性值的元素

[attribute*=value] 获取属性值中包含指定内容的全部元素

$("li[title*='新']")获取了属性值中包含“新”的li元素

:first-child 获取每个父元素中返回的首个子元素,它是一个集合,常用多个集合数据的选择处理。

$("li:first-child")获取了所有个<ul>父元素中的第一个<li>元素

:last-child 获取父元素总的最后一个子元素 常用多个集合数据的选择处理

表单选择器

:input 获取表单全部元素 返回全部的表单元素,不仅包括所有<input>标记的表单元素,而且还包括<textarea>、<select> 和

<button>标记的表单元素,它选择的表单元素是最广的

:text 获取表单中全部单行的文本输入框 对textarea不起作用

:password 获取表单中全部的密码输入文本框元素

:radio 获取表单中的全部单选按钮元素。

:checkbox 获取表单中的复选框元素。()

:submit 获取表单中的提交按钮元素。(一般一个表单中只有一个type属性是“submit”的按钮) 如果button没有定义会默认是

submit的提交按钮

:image 获取当“input元素的type属性是image时,这个元素就是一个图像域”这个类下的元素

:image 选择器只能获取<input>图像域,而不能获取<img>格式的图像元素

:button 选择器能获取且只能获取“type”属性值为“button”的<input>和<button>这两类普通按钮元素。

:checked 获取处于选中状态的全部元素。

:selected 只能获取<select>下拉列表框中全部处于选中状态的<option>选项元素。

以上这篇对jQuary选择器的全面总结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一段实时更新的时间代码
Jul 07 Javascript
js自定义事件及事件交互原理概述(二)
Feb 01 Javascript
在jquery boxy中添加百度地图坐标拾取注意流程
Apr 03 Javascript
JavaScript中Cookie操作实例
Jan 09 Javascript
调试JavaScript中正则表达式中遇到的问题
Jan 27 Javascript
JavaScript实现表格点击排序的方法
May 11 Javascript
jQuery、zepto、js常用小技巧
Feb 12 Javascript
node.js实现回调的方法示例
Mar 01 Javascript
浅析vue component 组件使用
Mar 06 Javascript
bootstrap的常用组件和栅格式布局详解
May 02 Javascript
ExtJs的Ext.Ajax.request实现waitMsg等待提示效果
Jun 14 Javascript
vue 保留两位小数 不能直接用toFixed(2) 的解决
Aug 07 Javascript
jQuery实现的可编辑表格完整实例
Jun 20 #Javascript
jQuery文件上传控件 Uploadify 详解
Jun 20 #Javascript
javascript js 操作数组 增删改查的简单实现
Jun 20 #Javascript
浅谈JavaScript中数组的增删改查
Jun 20 #Javascript
【经验总结】编写JavaScript代码时应遵循的14条规律
Jun 20 #Javascript
jQuery Tags Input Plugin(添加/删除标签插件)详解
Jun 20 #Javascript
javascript实现随机生成DIV背景色
Jun 20 #Javascript
You might like
获取远程文件大小的php函数
2010/01/11 PHP
PHP速成大法
2015/01/30 PHP
php简单中奖算法(实例)
2017/08/15 PHP
强悍无比的WEB开发好助手FireBug(Firefox Plugin)
2007/01/16 Javascript
深入理解javascript中defer的作用
2013/12/11 Javascript
自己动手写的javascript前端等待控件
2015/10/30 Javascript
Treegrid的动态加载实例代码
2016/04/29 Javascript
基于bootstrap按钮式下拉菜单组件的搜索建议插件
2017/03/25 Javascript
用JS编写一个函数,返回数组中重复出现过的元素(实例)
2017/09/14 Javascript
ES6中Array.find()和findIndex()函数的用法详解
2017/09/16 Javascript
详解如何在React组件“外”使用父组件的Props
2018/01/12 Javascript
js判断输入框不能为空格或null值的实现方法
2018/03/02 Javascript
webpack+vue+express(hot)热启动调试简单配置方法
2018/09/19 Javascript
图文讲解用vue-cli脚手架创建vue项目步骤
2019/02/12 Javascript
详解vue-cli3开发Chrome插件实践
2019/05/29 Javascript
简谈创建React Component的几种方式
2019/06/15 Javascript
JavaScript创建、读取和删除cookie
2019/09/03 Javascript
vue - props 声明数组和对象操作
2020/07/30 Javascript
详细讲解Python中的文件I/O操作
2015/05/24 Python
在Python的Django框架中显示对象子集的方法
2015/07/21 Python
Tensorflow之Saver的用法详解
2018/04/23 Python
对python 数据处理中的LabelEncoder 和 OneHotEncoder详解
2018/07/11 Python
Python中__slots__属性介绍与基本使用方法
2018/09/05 Python
Python 实现中值滤波、均值滤波的方法
2019/01/09 Python
python sorted方法和列表使用解析
2019/11/18 Python
Python3和pyqt5实现控件数据动态显示方式
2019/12/13 Python
pytorch中的自定义反向传播,求导实例
2020/01/06 Python
什么是python的列表推导式
2020/05/26 Python
Python不支持 i ++ 语法的原因解析
2020/07/22 Python
css3 自定义字体font-face使用介绍
2014/05/14 HTML / CSS
CSS3圆角边框和边界图片效果实例
2016/07/01 HTML / CSS
TecoBuy澳大利亚:在线电子和小工具商店
2020/06/25 全球购物
重写子类方法时,抛出异常的书写注意事项
2015/10/17 面试题
会计求职信
2014/05/29 职场文书
自主招生推荐信格式模板
2015/03/24 职场文书
Golang连接并操作MySQL
2022/04/14 MySQL