js进阶 11-15 jquery过滤方法有哪些
js进阶 11-15 jquery过滤方法有哪些
一、总结
一句话总结:jquery方法中的参数一般是什么:选择器、元素或 jQuery 对象。
1、jquery方法中的参数一般是什么?
选择器、元素或 jQuery 对象
2、has()如何使用(如何选取有em元素的对象)?
36 // $('li').has('em').css("background-color", "pink")
3、is()方法如何使用(选择某个元素是不是有pink1类或者pink2类)?
34 // alert($('li:eq(3)').is('.pink1,.pink2'))
4、not()方法如何使用(如何选取不是pink1类和pink2类的元素)?
32 // $('li').not('.pink1,.pink2').css("background-color", "pink");
5、jquery中如何选取一段?
slice(start, [end])把匹配元素集合缩减为指定的指数范围的子集。
- start:开始选取子集的位置。第一个元素是0.如果是负数,则可以从集合的尾部开始选起。
- end:结束选取自己的位置,如果不指定,则就是本身的结尾。
37 // $('li').slice(0,3).css("background-color", "pink")
二、jquery过滤方法有哪些
1、相关知识
为了更加灵活迅速地操作元素,除了选择器之外,jQuery还为我们提供了过滤、查找方法。过滤和查找补充了很多使用选择器无法进行的操作
- first()/last() 方法返回被选元素的首个元素/最后一个元素。
- eq() 方法返回被选元素中带有指定索引号的元素。
索引号从 0 开始,因此首个元素的索引号是 0 而不是 1
- filter() 方法允许您规定一个标准。不匹配这个标准的元素会被从集合中删除,匹配的元素会被返回。
- not() 方法返回不匹配标准的所有元素。
- is() 判断所选元素是否有符合某个条件的元素,返回值为true或false.
根据选择器、元素或 jQuery 对象来检测匹配元素集合,如果这些元素中至少有一个元素匹配给定的参数,则返回 true。
- has() 使用“自定义表达式”来选择符合条件的元素
- slice(start, [end])把匹配元素集合缩减为指定的指数范围的子集。
start:开始选取子集的位置。第一个元素是0.如果是负数,则可以从集合的尾部开始选起。
end:结束选取自己的位置,如果不指定,则就是本身的结尾。
2、代码
<!DOCTYPE html>
<html lang="en">
<style>
</style>
<head>
<meta charset="UTF-8">
<title>演示文档</title>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<style>
li{
margin-top: 5px;width: 150px;
}
</style>
</style>
</head>
<body>
<ol>
<li>1</li>
<li>2</li>
<li class="pink1"><em>3</em></li>
<li class="pink2">4</li>
<li>5</li>
</ol>
<input id="btn1" type="button" value='is'>
<script type="text/javascript">
$(function(){
// $('li:first').css("background-color", "orange");
// $('li').first().css("background-color", "orange");
// $('li').last().css("background-color", "orange");
// $('li').eq(1).css("background-color", "green");
// $('li').filter('.pink1,.pink2').css("background-color", "pink");
// $('li').not('.pink1,.pink2').css("background-color", "pink");
// $('#btn1').click(function(){
// alert($('li:eq(3)').is('.pink1,.pink2'))
// })
// $('li').has('em').css("background-color", "pink")
// $('li').slice(0,3).css("background-color", "pink")
$('li').slice(-4,-2).css("background-color", "pink") })
</script>
</body>
</html>
js进阶 11-15 jquery过滤方法有哪些的更多相关文章
- js进阶课程 12-9 jquery的事件对象event的方法有哪些?
js进阶课程 12-9 jquery的事件对象event的方法有哪些? 一.总结 一句话总结:三组六个,阻止默认事件一组,阻止冒泡一组,阻止冒泡和剩余事件一组. 1.事件的默认动作指什么? 比如点a标 ...
- js进阶正则表达式15验证身份证号(|符号的使用:var reg=/^\d{17}[\d|X]$|^\d{15}$/)(str的方法substr)
js进阶正则表达式15验证身份证号(|符号的使用:var reg=/^\d{17}[\d|X]$|^\d{15}$/)(str的方法substr) 一.总结 1.|符号的使用:var reg=/^\d ...
- js进阶---12-11、jquery如何给动态创建出来的元素绑定事件
js进阶---12-11.jquery如何给动态创建出来的元素绑定事件 一.总结 一句话总结:通过事件委托的方式,通过on方法 1.on方法在事件绑定的时候,data方式带额外参数时,字符串参数和其它 ...
- js进阶---12-12、jquery事件委托怎么使用
js进阶---12-12.jquery事件委托怎么使用 一.总结 一句话总结:通过on方法(事件委托),给要绑定事件的元素的祖先绑定事件,从而达到效果. 1.事件委托是什么? 通过事件冒泡,让子元素绑 ...
- js进阶---12-10、jquery绑定事件和解绑事件是什么
js进阶---12-10.jquery绑定事件和解绑事件是什么 一.总结 一句话总结:on和off. 1.jquery如何给元素绑定事件? on方法 22 $('#btn1').on('click', ...
- js进阶 14-5 $.getScript()和$.getJSON()方法的作用是什么
js进阶 14-5 $.getScript()和$.getJSON()方法的作用是什么 一.总结 一句话总结:$.getScript()和$.getJSON()方法专门用来加载JS/JSON文件(远程 ...
- js进阶 13-11/12 jquery如何实现折叠导航
js进阶 13-11/12 jquery如何实现折叠导航 一.总结 一句话总结:还是用的slideToggle滑动效果,并且这一个展开时,所有兄弟都关闭. 1.文字缩进怎么设置? 感觉设置margin ...
- js进阶 13-9/10 jquery如何实现三级列表
js进阶 13-9/10 jquery如何实现三级列表 一.总结 一句话总结:用的是定位,父标签相对定位,子标签就可以绝对定位了,绝对定位的孩子还是可以设置绝对定位.用toggle设置子菜单显示和隐藏 ...
- js进阶 11-4/5 jquery中css的类的操作有哪些
js进阶 11-4/5 jquery中css的类的操作有哪些 一.总结 一句话总结:jquery中css的类的操作有增删切三种. 1.jquery中css的类的操作有哪些? 增删切三种 addCla ...
随机推荐
- Funui-Theme 资源的替换
实现资源的替换,需要分为以下几个步骤 1.找到需要更改的模块 mediatek/packages/apps/FileManager 2.到主题模块下根据包名找到相应资源(以Grass为例) cd ve ...
- HTTP协议建立连接、通讯与关闭连接全过程
为解决服务器TimeWait多的问题,了解了一下TCP/IP协议的连接过程.以访问一静态页面为例,从建立连接到访问拿到数据,然后关闭的整个过程.使用EtherPeek截图如下: 图首为一次交互过程 ...
- IAR FOR STM8 学习笔记 IAR工程的建立
STM8是ST意法半导体针对工业应用和消费电子开发而推出的8位单片机. 每种MCU都有自身的优点与缺点,与其它8-bit MCU相比,STM8 8-bit MCU最大的特点是: · 内核: o 最高f ...
- 5.Node.js 安装配置
转自:http://www.runoob.com/nodejs/nodejs-tutorial.html Node.js安装包及源码下载地址为:https://nodejs.org/en/downlo ...
- 洛谷P3374 【模板】树状数组 1(CDQ分治)
题目描述 如题,已知一个数列,你需要进行下面两种操作: 1.将某一个数加上x 2.求出某区间每一个数的和 输入输出格式 输入格式: 第一行包含两个整数N.M,分别表示该数列数字的个数和操作的总个数. ...
- MFC ClistCtr锁定隐藏某一列
通过设置列的宽度为0, 可以隐藏列表框的某一列,但是用户通过拖动列表框的大小,隐藏的列,可能又被显示出来了. 我们可以自己写一个CListEx继承CListCtr,然后捕获拖动的消息,对该消息进行特殊 ...
- Redis-消费模式
一 . 两种模式简介 发布消息通常有两种模式:队列模式(queuing)和发布订阅模式(qublish-subscribe).队列模式中,consumers可以同时从服务端读取消息,每个消息纸杯其中一 ...
- Java基础学习总结(38)——Lombok的使用和原理
一.项目背景 在写Java程序的时候经常会遇到如下情形: 新建了一个Class类,然后在其中设置了几个字段,最后还需要花费很多时间来建立getter和setter方法 lombok项目的产生就是为 ...
- WCF REST (一)
最近工作中学习使用了WCF REST,REST 有很多好处 高效 简约 面向资源 而客户端调用 也变得非常简单.REST 入门的资料等 大家可以去网上找 这里主要分享下遇到的问题以及解决~ 一.环 ...
- 13. 关于IDEA工具在springboot整合mybatis中出现的Invalid bound statement (not found)问题
在一切准备就绪之后,测试test,却出现了org.apache.ibatis.binding.BindingException: Invalid bound statement (not found) ...