jQuery 查找元素操作实例小结


Posted in jQuery onOctober 02, 2019

本文实例讲述了jQuery 查找元素操作。分享给大家供大家参考,具体如下:

1. id

// 通过id查找
$('#id')

2. class

<div class='c1'></div>
// 通过class查找
$('.c1')

3. 标签、组合

<div id='i1' class='c1'>
  <a>x</a>
</div>
<div class='c1'>
  <div class='c2'>x</div>
</div>
// 标签:找到所有a标签
$('a')

4. 层级

<div>up</div>
<div id='i10'>
  <div>
    <a>x</a>
  </div>
    <a>x</a>
    <a>x</a>
</div>
<div>down</div>
// 以" "分割
// 查找指定id标签下的所有a标签
$('#i10 a')
// 以">"分割
// 查找指定id标签下子标签下的所有标签
$('#i10>div')
// 以"+"分割
// 查找指定id标签同级下的下一个div标签
$('#i10+div')
// 以"~"分割
// 查找指定id标签同级的所有div标签
$('#i10~div')

5. :first

<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li>list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>
// 获取匹配的第一个元素
$('li:first');
// 塞选某个ID下标签下的第一个元素
$('#ID>标签:first')

6. :eq(index)

<table>
 <tr><td>Header 1</td></tr>
 <tr><td>Value 1</td></tr>
 <tr><td>Value 2</td></tr>
</table>
// 匹配一个给定索引值的元素
$("tr:eq(1)")

7. :last()

<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li>list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>
// 获取最后个元素
$('li:last')

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery实现的手风琴侧边菜单效果
Mar 29 jQuery
Jquery-data的三种用法
Apr 18 jQuery
Spring shiro + bootstrap + jquery.validate 实现登录、注册功能
Jun 02 jQuery
JQueryMiniUI按照时间进行查询的实现方法
Jun 07 jQuery
jQuery Layer弹出层传值到父页面的实现代码
Aug 17 jQuery
JavaScript实现离开页面前提示功能【附jQuery实现方法】
Sep 26 jQuery
浅谈jquery fullpage 插件增加头部和版权的方法
Mar 20 jQuery
jQuery实现获取当前鼠标位置并输出功能示例
Jan 05 jQuery
jQuery实现的点击图片居中放大缩小功能示例
Jan 16 jQuery
jquery实现轮播图特效
Apr 12 jQuery
jquery实现手风琴案例
May 04 jQuery
使用jQuery实现购物车
Oct 29 jQuery
layui+jquery支持IE8的表格分页方法
Sep 28 #jQuery
jquery 回调操作实例分析【回调成功与回调失败的情况】
Sep 27 #jQuery
jquery中attr、prop、data区别与用法分析
Sep 25 #jQuery
jquery.tagsinput.js实现记录checkbox勾选的顺序
Sep 21 #jQuery
jquery弹窗时禁止body滚动条滚动的例子
Sep 21 #jQuery
jQuery设置下拉框显示与隐藏效果的方法分析
Sep 15 #jQuery
基于jquery ajax的多文件上传进度条过程解析
Sep 11 #jQuery
You might like
php中怎么搜索相关联数组键值及获取之
2013/10/17 PHP
php对二维数组进行相关操作(排序、转换、去空白等)
2015/11/04 PHP
php头像上传预览实例代码
2017/05/02 PHP
JavaScript的Cookies
2008/01/16 Javascript
Nodejs实现的一个静态服务器实例
2014/12/06 NodeJs
js计算系统当前日期是星期几的方法
2016/07/14 Javascript
jqGrid翻页时数据选中丢失问题的解决办法
2017/02/13 Javascript
jQuery实现下拉菜单的实例代码
2017/06/19 jQuery
前端跨域的几种解决方式总结(推荐)
2017/08/16 Javascript
使用jQuery实现页面定时弹出广告效果
2017/08/24 jQuery
JS实现静态页面搜索并高亮显示功能完整示例
2017/09/19 Javascript
JavaScript设计模式之命令模式实例分析
2019/01/16 Javascript
JS Generator 函数的含义与用法实例总结
2020/04/08 Javascript
[59:48]LGD vs IG 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
python脚本内运行linux命令的方法
2015/07/02 Python
Python松散正则表达式用法分析
2016/04/29 Python
Python数据类型详解(四)字典:dict
2016/05/12 Python
python+Django+apache的配置方法详解
2016/06/01 Python
Flask框架 CSRF 保护实现方法详解
2019/10/30 Python
Python 将json序列化后的字符串转换成字典(推荐)
2020/01/06 Python
TensorFlow实现模型断点训练,checkpoint模型载入方式
2020/05/26 Python
中国第一家杂志折扣订阅网:杂志铺
2016/08/30 全球购物
Expedia意大利旅游网站:酒店、机票和租车预订
2017/10/30 全球购物
荷兰包包购物网站:The Little Green Bag
2018/03/17 全球购物
英国天然宝石首饰购买网站:Gemondo Jewellery
2018/10/23 全球购物
人事科岗位职责范本
2014/03/02 职场文书
令人印象深刻的自荐信
2014/05/25 职场文书
党员学习新党章思想汇报
2014/10/25 职场文书
告知书格式
2015/07/01 职场文书
初任公务员培训心得体会
2016/01/08 职场文书
2016关于读书活动的心得体会
2016/01/14 职场文书
2019运动会广播加油稿汇总
2019/08/21 职场文书
Flask搭建一个API服务器的步骤
2021/05/28 Python
Java 在线考试云平台的实现
2021/11/23 Java/Android
Python实现自动玩连连看的脚本分享
2022/04/04 Python
SQL Server 中的事务介绍
2022/05/20 SQL Server