jquery获取对象的方法足以应付常见的各种类型的对象


Posted in Javascript onMay 14, 2014

(1)基本对象获取

$("*")
获取所有对象

$("#element")
获取id为element的对象等同于document.getElementById(“element”);

$(".abc")
获取class为abc的对象

$("div")
获取html中所有的div元素

$("#a,.b,p")
获取id为a和class为b以及所有p元素

$("#a .b p")
获取id为a并且class为b元素下的p元素

(2)层级对象获取

$("div>input")
获取div下所有input对象

$("div+h")
获取紧跟在div后的一个h元素

$("div~p")
获取在元素div之后的所有p元素

(3)简单对象获取

$("element:first")
获取页面上某个元素的第一个如$("div:frist")表示第一个div

$("element:last")
获取页面上某个元素的最后一个如$("div:frist")表示最后一个div

$("element:not(selector)")
去除所有与选择器匹配的元素如$("input:not(:check)")表示所有未被选中的复选框

$("element:even")
获取element元素的偶数行

$("element:odd")
获取元素的奇数行

$("element:eq(index)")
获取特定索引的元素 如$("div:el(2)")表示第三个div

$("element:gt(index)")
匹配所有大于给定索引值的元素

$("element:lt(index)")
匹配所有小于给定索引的元素

$(":header")
匹配h标记的元素

$("element:animated")
匹配所有没有执行动画效果的元素

(4)内容对象的获取和对象的可见性

$("Element:contains(text)")
元素中的文本是否包含某个字母或字符串

$("Element:empty")
获得不包含文本或子元素的元素对象

$("Element:parent")
获得对象元素包含文本或子元素

$("Element:has(selector)")
匹配含有某个元素是否包含某个元素 如$("p:has(span)")表示所有包含span元素的p元素

$("Element:hidden")
匹配所有不可见元素,包括display:none 以及input的属性是hidden的元素

$("Element:visible")
匹配所有课件元素

(5)对象获取进阶

$("Element[id]")
获取所有带有id属性的元素

$("Element[attribute=abcd]")
获取所有某个属性为abcd的元素

$("Element[attribute!=abcd]")
获得所有某个属性不为abcd的元素

$("Element[attribute^=ab]")
获得所有某个属性以ab开头的元素

$("Element[attribute$=ab]")
获得所有某个属性以ab结尾的元素

$("Element[attribute*=ab]")
获得所有含有某个属性包含ab的元素

$("Element[selector1][selector2][.....]")
符合属性选择器 如$("input[id][name][value=abcd]")表示获得带有ID、Name以及value是abcd的input元素

(6)子元素的获取

$("Element:nth-child(index)")
选择父级下的第N个子元素,索引从1开始
:nth-child(even)偶数
:nth-child(odd)奇数
:nth-child(3n)表达式
:nth-child(2)索引
:nth-child(3n+1)表达式

$("Element:first-child")
父级下的第一个子级元素

$("Element:last-child")
父级下的最后一个子级元素

$("Element:only-child")
父级下的唯一的一个子级元素

(7)表单对象的获取

$(:input)
只能匹配input元素类型为 input button select textarea

$(:text)
所有当行文本框

$(:password)
所有密码框

$(:radio)
所有单选按钮

$(:checkbox)
所有复选框

$(:submit)
所有提交按钮

$(:image)
所有图片域
$(:reset)
所有充值按钮

$(:button)
所有按钮

$(:file)
所有的文件上传域

$(:hidden)
所有不可见元素或者type为hidden的元素

$(:enabled)
所有可用input元素

$(:disabled)
所有不可用input元素

$(:checked)
所有复选框元素

$(:selected)
所有下拉表

(8)元素属性的设置与移除

$("Element").attr(name)
取得第一个匹配元素的属性值 如$("img").attr("src");

$("Element").attr({key:value,key:value,......})
为某一个元素一次性设置多个属性

$("Element").attr(key,value)
为某个元素设置属性

$("Element").attr(key,function)
为所有匹配的元素设置一个计算的属性

$("Element").removeAttr(name)
移除某一个属性

Javascript 相关文章推荐
js类中的公有变量和私有变量
Jul 24 Javascript
来自qq的javascript面试题
Jul 24 Javascript
Jquery命名冲突解决的五种方案分享
Mar 16 Javascript
javascript操作JSON的要领总结
Dec 09 Javascript
JavaScript设计模式之工厂模式和构造器模式
Feb 11 Javascript
jQuery实现的倒计时效果实例小结
Apr 16 Javascript
jquery属性,遍历,HTML操作方法详解
Sep 17 Javascript
Vue.js手风琴菜单组件开发实例
May 16 Javascript
AngularJS实现与后台服务器进行交互的示例讲解
Aug 13 Javascript
layui实现checkbox的目录树tree的例子
Sep 12 Javascript
vue开发chrome插件,实现获取界面数据和保存到数据库功能
Dec 01 Vue.js
js实现Element中input组件的部分功能并封装成组件(实例代码)
Mar 02 Javascript
jquery-syntax动态语法着色示例代码
May 14 #Javascript
jquery对table中各数据的增加、保存、删除操作示例
May 14 #Javascript
调整小数的格式保留小数点后两位
May 14 #Javascript
原生js的弹出层且其内的窗口居中
May 14 #Javascript
js 获取页面高度和宽度兼容 ie firefox chrome等
May 14 #Javascript
使用jquery选择器如何获取父级元素、同级元素、子元素
May 14 #Javascript
JavaScript函数获取事件源的小例子
May 14 #Javascript
You might like
php 购物车实例(申精)
2009/05/11 PHP
解析CI的AJAX分页 另类实现方法
2013/06/27 PHP
PHP中date与gmdate的区别及默认时区设置
2014/05/12 PHP
php实例分享之通过递归实现删除目录下的所有文件详解
2014/05/15 PHP
10个实用的PHP正则表达式汇总
2014/10/23 PHP
php 三大特点:封装,继承,多态
2017/02/19 PHP
javascript AutoScroller 函数类
2009/05/29 Javascript
javascript attachEvent绑定多个事件执行顺序问题
2010/10/20 Javascript
js通过googleAIP翻译PHP系统的语言配置的实现代码
2011/10/17 Javascript
JavaScript全排列的六种算法 具体实现
2013/06/29 Javascript
使用jQuery实现验证上传图片的格式与大小
2014/12/03 Javascript
jQuery中innerWidth()方法用法实例
2015/01/19 Javascript
javascript事件委托的用法及其好处简析
2016/04/04 Javascript
纯js仿淘宝京东商品放大镜功能
2017/03/02 Javascript
JS实现的Unicode编码转换操作示例
2017/04/28 Javascript
Bootstrap 模态框(Modal)带参数传值实例
2017/08/20 Javascript
原生js实现拖拽功能基本思路详解
2018/04/18 Javascript
为什么使用koa2搭建微信第三方公众平台的原因
2018/05/16 Javascript
jQuery扩展方法实现Form表单与Json互相转换的实例代码
2018/09/05 jQuery
Vue源码探究之状态初始化
2018/11/14 Javascript
微信小程序点击item使之滚动到屏幕中间位置
2020/03/25 Javascript
用Angular实现一个扫雷的游戏示例
2020/05/15 Javascript
微信小程序实现左滑删除效果
2020/11/18 Javascript
vue中watch的用法汇总
2020/12/28 Vue.js
[03:03]DOTA2校园争霸赛 济南城市决赛欢乐发奖活动
2013/10/21 DOTA
Python使用回溯法子集树模板解决迷宫问题示例
2017/09/01 Python
pandas筛选某列出现编码错误的解决方法
2018/11/07 Python
python实现五子棋人机对战游戏
2020/03/25 Python
python plotly画柱状图代码实例
2019/12/13 Python
Python爬虫HTPP请求方法有哪些
2020/06/03 Python
django项目中使用云片网发送短信验证码的实现
2021/01/19 Python
CSS3混合模式mix-blend-mode/background-blend-mode简介
2018/03/15 HTML / CSS
需要知道的CSS3动画技术
2010/01/01 HTML / CSS
Interrail法国:乘火车探索欧洲,最受欢迎的欧洲铁路通票
2019/08/27 全球购物
党的群众路线学习笔记
2014/11/06 职场文书
法人身份证明书
2015/06/18 职场文书