1、过滤

    eq(index|-index)  获取当前链式操作中第N个jquery对象,正数从0开始,负数从-1开始。

  first 获取当前链式操作中第1个jquery对象

  last 获取当前链式操作中最后一个jquery对象

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p>this is a test</p>
<p>so it is</p>
<p>this just a test</p>
<div class="div"></div>
<script src="jquery-3.1.0.js"></script>
<script type="text/javascript">
// 获取所有返回的p元素中第一个和第-2个元素
$("p").eq(1).text()
$("p").eq(-2).text()
$("p").first()
$("p").last()
console.log(objs)
</script>
</body>
</html>

  2、查找

  children([expre])  所选元素下的所有子元素,

  find(e|o|e) 搜索所有与指定表达式匹配的元素,包括子元素、孙元素等

  next(expr) 所有匹配的元素紧临的下一个同辈元素的集合

  nextAll([expr]) 所有匹配元素后面紧临的所有同辈元素的集合

  prev([expr]) 所有匹配的元素紧临的前一个同辈元素的集合

  prevAll([expr]) 所有匹配元素前面紧临的所有同辈元素的集合

  parent([expr])  所有匹配元素的唯一父元素,即上一级元素,而不包括上上级元素

  siblings([expr]) 所有匹配元素的前后同辈元素集合

示例代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--HTML区域-->
<h1>第一个标题</h1>
<div class="nav-2014">
<div class="w">
<div class="w-spacer"></div>
<div class="categorys">
<div class="dt">家用电器分类</div>
<div class="dp">家用电器价格</div>
</div>
<span class="hr"></span>
<div class="navitems-2014">
<div id="treasure"></div>
<span class="clr"></span>
<span class="chr"></span>
男:<input type="checkbox" checked="checked" value="nan">
女:<input type="checkbox" value="nv">
</div>
</div>
</div>
<h2>第二个标题</h2>
<div id="electronic">
<div id="firstScreen">1
<div class="w">2</div>
</div>
<ul>
<li class="ui-switch-curr">第一</li>
<li class="ui-switch-item"></li>
<li class="ui-switch-next">第三</li>
<li class="ui-switch-sub">第四</li>
</ul>
<ul>
<div class="ul_div"></div>
<li class="lizi_ws_fruit" name="zhuang_guo">
<div class="test">test</div>
梨</li>
<li class="ws_pingguo_fruit" name="zhuan_wang">苹果</li>
<li id="elpsq" name="zhuang_dang"></li>
</ul>
<div class="secord_screen">
<div></div>
</div>
<div class="third_screen"></div>
</div> <!--jquery区域-->
<script src="jquery-3.1.0.js"></script>
<script>
// 匹配id为electronic元素的所有子元素,即下一级元素,孙元素不包括在内
$("#electronic").children()
$("#electronic").children("[class$=screen]")
// 匹配所有ul标签下的所有div标签,包括子元素及孙元素等
$("ul").find("div")
// 匹配id为firstScreen的元素的下一个同辈元素,即ul元素
$("#firstScreen").next()
// 匹配span标签的下一个同辈元素中属性为chr的元素
$("span").next(".chr")
// 匹配id为firstScreen的元素后面的所有紧临同辈元素
$("#firstScreen").nextAll()
// 匹配div标签中class值为test的父元素
$("div .test").parent()
// 匹配class属性名为switch的前一个同辈元素
$(".ui-switch-next").prev()
// 匹配class属性名为switch的前面所有同辈元素
$(".ui-switch-sub").prevAll()
// 匹配class值为ui-switch-next的元素前后所有同辈元素
$(".ui-switch-next").siblings()
// 匹配class值为categorys的元素的前后所有同辈元素中,span标签元素
$(".categorys").siblings("span")
console.log(objs)
</script>
</body>
</html>

  

  

jquery筛选器的更多相关文章

  1. jQuery 筛选器1

    jQuery 筛选器1 筛选器1: 在选择器选择的基础上在选择一次 // 当前点击的标签$(this) $(this) // .next() 获取当标签的下一个标签 $(this).next(); / ...

  2. jQuery 筛选器2

    jQuery 筛选器2 // 由于$()只能输入字符串$('#li:eq(1)'),可通过.eq()来传入. // 获取this标签中的指定属性 $(this).eq(1) // 获取第一个元素 $( ...

  3. jQuery筛选器及对DOM修改(学习笔记)

    1.jQuery筛选器 注意:请先在管理Nuget程序包中查找jQuery包,并安装.也可以在jQuery官网下载. 实现: <!DOCTYPE html> <html xmlns= ...

  4. 【jQuery】jQuery筛选器规则

    转载自:http://blog.csdn.net/lijinwei112/article/details/6938134 筛选器中加入变量 var ac = "select_" + ...

  5. jQuery筛选器常用总结

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  6. jQuery筛选器及练习

    jQuery初识   jQuery是什么? jQuery是一个兼容多浏览器的JavaScript库. jQuery能极大地简化JavaScript编程,它的宗旨就是:"Write less, ...

  7. jQuery笔记-jQuery筛选器children()详解

    jQuery的选择包含两种,一种是选择器,一种是筛选器.筛选器是对选择器选定的jQuery对象做进一步选择. children()是一个筛选器,顾名思义就是筛选孩子,筛选那些符合条件的孩子. 完整的格 ...

  8. python jQuery筛选器

    筛选器:$(this).next() 下一个    $(this).prev  上一个    $(this).parent()  父     $(this).children() 孩     $(th ...

  9. JQuery筛选器全系列介绍

    jQuery提供了强大的选择器让我们获取对象.在这边,我人为地将jQuery选择器分为两大部分:选择对象和筛选条件.选择对象表示要获取什么对象,筛选条件是对获取的对象进行筛选,最终留下符合某些特征的对 ...

  10. jQuery 筛选器 链式编程操作

    $('#i1').next() 下一个标签$('#i1').nextAll() 兄弟标签中,所有下一个标签$('#i1').nextUntil('#ii1') 兄弟标签中,从下一个标签到id为ii1的 ...

随机推荐

  1. JAVA中管道通讯(线程间通讯)例子

    Java I/O系统是建立在数据流概念之上的,而在UNIX/Linux中有一个类似的概念,就是管道,它具有将一个程序的输出当作另一个程序的输入的能力.在Java中,可以使用管道流进行线程之间的通信,输 ...

  2. Python学习路程day21

    本节内容: 项目实战:开发一个WEB聊天室 功能需求: 用户可以与好友一对一聊天 可以搜索.添加某人为好友 用户可以搜索和添加群 每个群有管理员可以审批用户的加群请求,群管理员可以用多个,群管理员可以 ...

  3. Hadoop程序运行中的Error(1)-Error: org.apache.hadoop.hdfs.BlockMissingException

    15/03/18 09:59:21 INFO mapreduce.Job: Task Id : attempt_1426641074924_0002_m_000000_2, Status : FAIL ...

  4. tabhost使用

    Tabhost用法 使用方法一:使用同一个布局文件 在xml中如此定义tabhost: <RelativeLayout xmlns:android="http://schemas.an ...

  5. Jquery和Javascript 实际项目中写法基础-弹出窗和弹出层 (4)

     一.实际项目中有很多如下界面效果.    二.该效果可以归结为弹出窗或者弹出层来实现的,为什么这么说?看如下代码:      <!DOCTYPE html> <html> & ...

  6. Android通过webservice连接SQLServer 详细教程(数据库+服务器+客户端)

    http://blog.csdn.net/zhyl8157121/article/details/8169172 目录(?)[-] 项目说明 开发环境的部署 数据库设计 服务器端程序设计Webserv ...

  7. vs2013提高编译速度

    最近做新的项目,很多库是之前项目积累下来的库.在windows下使用的IDE是vs2013,整体编译的时候,明显感觉编译速度较慢,文件是一个一个编的. 从编译器本身的角度,vs2013是提供了加快编译 ...

  8. 用python+selenium抓取微博24小时热门话题的前15个并保存到txt中

    抓取微博24小时热门话题的前15个,抓取的内容请保存至txt文件中,需要抓取排行.话题和阅读数 #coding=utf-8 from selenium import webdriver import ...

  9. linux sed的使用

    sed是一个很好的文件处理工具,本身是一个管道命令,主要是以行为单位进行处理, 可以将数据行进行替换.删除.新增.选取等特定工作. sed本质上是一个编辑器,但是它是非交互式的,这点与VIM不同:同时 ...

  10. web发布 将各个文件夹输出合并到其自己的程序集 注意事项

    今天在发布web网站的时候 使用了“将各个文件夹输出合并到其自己的程序集”的选项,如图: 开始在 程序集前缀(可选)处,没有填写内容. 发布到IIS后出现未加载到程序集xxxx的错误. 经过各种调试, ...