对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 相关文章推荐
CLASS_CONFUSION JS混淆 全源码
Dec 12 Javascript
用javascript getComputedStyle获取和设置style的原理
Oct 10 Javascript
基于jQuery的实现简单的分页控件
Oct 10 Javascript
E3 tree 1.6在Firefox下显示问题的修复方法
Jan 30 Javascript
JS模板实现方法
Apr 03 Javascript
JavaScript 基本概念
Jan 20 Javascript
jquery获得当前html页面源码的方法
Jul 14 Javascript
jQuery实现类似标签风格的导航菜单效果代码
Aug 25 Javascript
jQuery实现表格隔行及滑动,点击时变色的方法【测试可用】
Aug 20 Javascript
详解webpack分离css单独打包
Jun 21 Javascript
React Router v4 入坑指南(小结)
Apr 08 Javascript
JS实现购物车基本功能
Nov 08 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
咖啡产品发展的三大浪潮
2021/03/04 咖啡文化
mysql 字段类型说明
2007/04/27 PHP
php中使用gd库实现下载网页中所有图片
2015/05/12 PHP
PHP代码判断设备是手机还是平板电脑(两种方法)
2015/10/19 PHP
PHP的Yii框架中行为的定义与绑定方法讲解
2016/03/18 PHP
TP5框架使用QueryList采集框架爬小说操作示例
2020/03/26 PHP
JS+CSS实现淡入式焦点图片幻灯切换效果的方法
2015/02/26 Javascript
深入理解node exports和module.exports区别
2016/06/01 Javascript
bootstrap daterangepicker汉化以及扩展功能
2017/06/15 Javascript
微信小程序获取循环元素id以及wx.login登录操作
2017/08/17 Javascript
js 发布订阅模式的实例讲解
2017/09/10 Javascript
慕课网题目之js实现抽奖系统功能
2017/09/19 Javascript
简述vue中的config配置
2018/01/23 Javascript
Spring Boot/VUE中路由传递参数的实现代码
2018/03/02 Javascript
JS中实现隐藏部分姓名或者电话号码的代码
2018/07/17 Javascript
在小程序开发中使用npm的方法
2018/10/17 Javascript
vue.draggable实现表格拖拽排序效果
2018/12/01 Javascript
Vue 使用formData方式向后台发送数据的实现
2019/04/14 Javascript
layui实现数据分页功能
2019/07/27 Javascript
vue实现中部导航栏布局功能
2019/07/30 Javascript
javascript实现异形滚动轮播
2019/11/28 Javascript
如何编写一个 Webpack Loader的实现
2020/10/18 Javascript
[12:36]《DOTA2》国服注册与激活指南全攻略
2013/04/28 DOTA
使用实现pandas读取csv文件指定的前几行
2018/04/20 Python
对python中类的继承与方法重写介绍
2019/01/20 Python
python3.6、opencv安装环境搭建过程(图文教程)
2019/11/05 Python
python有序查找算法 二分法实例解析
2020/02/18 Python
pandas to_excel 添加颜色操作
2020/07/14 Python
canvas绘图按照contain或者cover方式适配并居中显示
2019/02/18 HTML / CSS
西班牙网上书店:Casa del Libro
2016/11/01 全球购物
运动服饰每月订阅盒:Ellie
2018/04/29 全球购物
企业治理工作自我评价
2013/09/26 职场文书
幼儿园家长会邀请函
2014/01/15 职场文书
保护环境的标语
2014/06/09 职场文书
单位接收函格式
2015/01/30 职场文书
幼儿园元旦主持词
2015/07/06 职场文书