Jquery获取元素方法
Jquery 获取元素的方法分为两种:jQuery选择器、jQuery遍历函数。
1、获取本身:
a.只需要一种jQuery选择器
| 选择器 | 实例 | 说明 |
| #Id | $('#myId') | ID选择器: 可以获取到ID为“myId”的元素,区分大小写 |
b.多种jQuery选择器组合
b1.jQuery选择器
| 选择器 | 实例 | 说明 |
| .class | $('.myClass') | 类选择器:可以获取到class为‘myClass’的所有元素 |
| element | $('p') | 获取所有的<p>元素 |
| :header | $(':header') | 获取所有的标题元素:<h1> ~ <h6> |
| :animated | $(':animated') | 获取所有的动画元素 |
| :contains(text) | $('p:contains(Hello)') | 获取所有包含文本为Hello的<p>元素,中间的文本区分大小写 |
| :hidden | $(':hidden') | 获取所有的隐藏元素:width和height为0、display:none、type=hidden、 |
| [attribute] | $('[href]') | 属性选择器:获取所有含有属性为href的元素 |
| [attribute=value] | $('[href=a.html]') |
= 获取所有带有属性href,并且值为a.html的元素 != 获取所有带有属性href,并且值不等于为a.html的元素 $= 获取所有带有属性href,并且值以a.html结尾的元素 ^= 获取所有带有属性href,并且值以a.html开头的元素 ~= 获取所有带有属性href,并且值包含单词”a.html“的元素 *= 获取所有带有属性href,并且值包含文本”a.html“的元素 |
| :input | $(':input') | 获取所有input元素 |
| :radio | $(':radio') |
所有带有 type="radio" 的 input 元素 相似的有: :text、:chexbox、:password、:submit、:reset、:button、:file |
| :enabled | $(':enabled') | 所有启用的input元素。 :disabled 则相反 |
| :checked | $(':checked') | 所有选中的input选择(单选框、复选框) |
| :gt(index) | $('p:gt(2)') | index从0开始,获取index大于(不包含)2的所有<p>元素 |
| :lt(index) | $('p:lt(2)') | index从0开始,获取index小于(不包含)2的所有<p>元素 |
| :even | $('tr:even') | 所有偶数<tr>元素 |
| :odd | $('tr:odd') | 所有奇数<tr>元素 |
b2.jQuery选择器jQuery遍历函数混合
| 选择器 | 实例 | 说明 |
| :first | $('p:first') | 第一个<p>元素 |
| :last | $('p:last') | 最后一个<p>元素 |
| :eq(index) | $("p:eq(1)") | 第二个<p>元素,index从0开始 |
b3.jQuery遍历函数
| 方法 | 描述 |
| eq() | 返回带有被选元素的指定索引号的元素 |
| first() | 返回被选元素的第一个元素 |
| last() | 返回被选元素的最后一个元素 |
2、选择同级元素
jQuery选择器
$('div + p') 每个div相邻的下一个<p>元素
$('div ~ p') 获取跟div同级的所有的<p>元素
jQuery遍历函数
next() 返回被选元素的后一个同级元素
nextAll() 返回被选元素之后的所有同级元素
prev() 返回被选元素的前一个同级元素
prevAll() 返回被选元素之前的所有同级元素
3、获取父级元素
jQuery选择器
$("p:parent")获取所有p元素的父级元素
jQuery遍历函数
parent() 获取被选元素的父级元素
parents() 获取被选元素的所有祖先元素
4.获取子级元素
jQuery选择器
$('div > p') 获取div直接子元素的所有<p>元素
$('div p') 获取div所有后代的<p>元素
jQuery遍历函数
children() 返回被选元素的所有直接子元素
contents() 返回被选元素的所有直接子元素(包含文本和注释节点)
find() 返回被选元素的后代元素
http://www.cnblogs.com/lanleiming/p/5201677.html#p2
Jquery获取元素方法的更多相关文章
- JQuery获取元素的方法总结
JQuery获取元素的方法总结 一.说明 获取元素的方法分为两种:jQuery选择器.jQuery遍历函数. 做个总结,巩固下知识. 二.获取本身 1.只需要一种jQuery选择器 选择器 实 ...
- [转载]jquery获取元素索引值index()方法:
jquery的index()方法 搜索匹配的元素,并返回相应元素的索引值,从0开始计数. 如果不给 .index() 方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的 ...
- jquery获取元素索引值index()方法
jquery的index()方法 搜索匹配的元素,并返回相应元素的索引值,从0开始计数. 如果不给 .index() 方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的 ...
- jquery 获取元素在浏览器中的绝对位置
代码详解 1,获取对象(自定义调整打开新窗口参照元素) var obj = $("#oButton"); 实例中我获取的对象是弹出窗口按钮,这样创建的新窗口就会根椐按钮的位置进行调 ...
- jquery获取元素到屏幕底的可视距离
jquery获取元素到屏幕底的可视距离 要打对号的图里的height(我自称为可视高度:滚动条未滑到最底端) 不是打叉图里的到页面底部(滚动条到最底部时的height)(offset().top方法 ...
- js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选
转载:https://www.cnblogs.com/ooo0/p/6278102.html js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) ...
- jquery 获取元素(父节点,子节点,兄弟节点),元素筛选
一, js 获取元素(父节点,子节点,兄弟节点) var test = document.getElementById("test"); var parent = test.p ...
- jquery获取元素索引值index()
jquery获取元素索引值index()方法实例. jquery获取元素索引值index()方法: jquery的index()方法 搜索匹配的元素,并返回相应元素的索引值,从0开始计数. 如果不给 ...
- jQuery DOM 元素方法(get)
jQuery DOM 元素方法 1..get() 获得由选择器指定的 DOM 元素. $(selector).get(index)index 可选.规定获取哪个匹配元素(通过 index 编号). 实 ...
随机推荐
- 7.1-uC/OS-III中断管理
在 uC/OS 系统中,中断相当于一个优先级最高的任务.中断一般用于处理比较紧急的事件, 而且只做简单处理,例如标记该事件,带退出中断后再做详细处理.在使用 uC/OS系统时, 一般建议使用信号量. ...
- SQL Server 2008中的CDC(Change Data Capture)功能使用及释疑
SQL Server 2008中的CDC(Change Data Capture)功能使用及释疑 关键词:CDC 原文:http://www.cnblogs.com/chenxizhang/arc ...
- 20190412 T-SQL语言一
-- T-SQL ------------------------------------------------------ 例如1 什么是注释符 单行注释select *from kc /*sel ...
- java之数据库连接池-dbcp&c3p0&dbutils
介绍 因为数据库连接对象的创建比较消耗性能,所以可以在应用程序启动时就在内存中开辟一片空间(集合)存放多个数据库连接对象,后面需要连接时直接从该空间中取而不用新创建:使用完毕后归还连接(将连接重新放回 ...
- Docker:Dockerfile命令详解
1.FROM 功能为指定基础镜像,并且必须是第一条指令. 如果不以任何镜像为基础,那么写法为:FROM scratch. 同时意味着接下来所写的指令将作为镜像的第一层开始 语法: FROM <i ...
- 经验分享 | 如何拿到自己满意的offer?
本文阅读时间约16分钟 最近两年,人工智能(AI)就像一个点石成金的神器,所有的行业,创业公司,或是求职,只要沾着这个词,多少有点脚踩五彩祥云的感觉,故事来了,融资来了,高薪来了. 于是,越来越多的人 ...
- Java 动态代理详解
package com.at221; //代理设计模式: interface ClothFactory{ void product(); } class NikeFactory implements ...
- HDU 1260
Jesus, what a great movie! Thousands of people are rushing to the cinema. However, this is really a ...
- Mysql 书写语句时避免出现关键字导致报错 关键字大全
ADD ALL ALTER ANALYZE AND AS ASC ASENSITIVE BEFORE BETWEEN BIGINT BINARY BLOB BOTH BY CALL CASCADE C ...
- Bootstrap日期插件在线使用,引入即可
引入部分 <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script& ...