jQuery 过滤not()与filter()实例代码


Posted in Javascript onMay 10, 2012

第一种写法:

$(function(){ 
$("li").not(":even").css("color","red"); 
$("li").filter(":odd").css("color","red"); })

第二种写法:
$(function(){ 
$("li").filter(function(index) { 
return index%2 == 0; 
}).css("color","red"); $("li").not(function(index) { 
return index%2 !== 0; 
}).css("color","red"); 
})

这两种写法,都可以达到一样的效果,not与filter是相反的过滤!

jQuery过滤选择器:not()方法介绍

jQuery(':not(selector)')
在jQuery的早期版本中,:not()筛选器只支持简单的选择器,说明我们传入到:not这个filter中的selector可以任意复杂,比如:not(div a) and :not(div,a)

<p >"a">sdfsdfs</p>
<p >"b">sdfsdfs</p>
<p >"c">sdfsdfs</p>

$("p:not(.a)").css({"color":"red"})
那么除了class等于a的p元素外,其他的P的文字颜色就变成了红色.
:not()伪类过滤选择器,这叫法真拗口,jQuery的:not()方法是jQuery的伪类选择器,可以过滤不需要的元素,筛选出正确的结果,简单的说我们有如下代码:

$("selector1:not(selector2)")
我们分析下上面的代码,我们要获取selector1的元素,但可能我不需要全部,怎么办,通过:not()方法来过滤,如果selector1的集合中有#1,#2,#3,#4
我们的selector2就是要过滤掉#4,上面的代码我们最终将获得#1,#2,#3
再举几个列子

$('li:not(:only-child)')//匹配所有的li,除了只有一个子元素的
$('li:not(:first-child)');//匹配除了在他父元素中是第一个子元素的LI
$("li :not(:first)").hide();//隐藏除了第一个LI外的所有LI

Javascript 相关文章推荐
EASYUI TREEGRID异步加载数据实现方法
Aug 22 Javascript
asp.net中System.Timers.Timer的使用方法
Mar 20 Javascript
js调用css属性写法
Sep 21 Javascript
用jquery中插件dialog实现弹框效果实例代码
Nov 15 Javascript
jquery如何判断表格同一列不同行input数据是否重复
May 14 Javascript
JS中完美兼容各大浏览器的scrolltop方法
Apr 17 Javascript
JavaScript实现的简单拖拽效果
Jun 01 Javascript
js实现符合国情的日期插件详解
Jan 19 Javascript
使用jquery判断一个元素是否含有一个指定的类(class)实例
Feb 12 Javascript
jQuery实现三级联动效果
Mar 02 Javascript
vue多种弹框的弹出形式的示例代码
Sep 18 Javascript
微信小程序webview组件交互,内联h5页面并网页实现微信支付实现解析
Aug 16 Javascript
jQuery 在光标定位的地方插入文字的插件
May 10 #Javascript
javascript 在firebug调试时用console.log的方法
May 10 #Javascript
jQueryUI写一个调整分类的拖放效果实现代码
May 10 #Javascript
基于jQuery捕获超链接事件进行局部刷新代码
May 10 #Javascript
让人印象深刻的10个jQuery手风琴效果应用
May 08 #Javascript
jQuery 图片切换插件(代码比较少)
May 07 #Javascript
仅IE支持clearAttributes/mergeAttributes方法使用介绍
May 04 #Javascript
You might like
php下批量挂马和批量清马代码
2011/02/27 PHP
解决PHP4.0 和 PHP5.0类构造函数的兼容问题
2013/08/01 PHP
使用图灵api创建微信聊天机器人
2015/07/23 PHP
PHP实现广度优先搜索算法(BFS,Broad First Search)详解
2017/09/16 PHP
ECMAScript 基础知识
2007/06/29 Javascript
判断客户浏览器是否支持cookie的示例代码
2013/12/23 Javascript
js控制网页背景音乐播放与停止的方法
2015/02/06 Javascript
浅析jQuery操作select控件的取值和设值
2016/12/07 Javascript
详解如何在Vue2中实现组件props双向绑定
2017/03/29 Javascript
微信小程序 request接口的封装实例代码
2017/04/26 Javascript
jQuery实现在HTML文档加载完毕后自动执行某个事件的方法
2017/05/08 jQuery
基于vue监听滚动事件实现锚点链接平滑滚动的方法
2018/01/17 Javascript
原生js实现省市区三级联动代码分享
2018/02/12 Javascript
C#程序员入门学习微信小程序的笔记
2019/03/05 Javascript
vue微信分享的实现(在当前页面分享其他页面)
2019/04/16 Javascript
JS判断数组里是否有重复元素的方法小结
2019/05/21 Javascript
jQuery HTML设置内容和属性操作实例分析
2020/05/20 jQuery
python网页请求urllib2模块简单封装代码
2014/02/07 Python
python图像处理之镜像实现方法
2015/05/30 Python
利用aardio给python编写图形界面
2017/08/21 Python
python3.6.3转化为win-exe文件发布的方法
2018/10/31 Python
在pycharm 中添加运行参数的操作方法
2019/01/19 Python
Python如何实现强制数据类型转换
2019/11/22 Python
基于python调用psutil模块过程解析
2019/12/20 Python
Python namedtuple命名元组实现过程解析
2020/01/08 Python
AP澳洲中文网:澳洲正品直邮,包税收件无忧
2019/07/12 全球购物
拉夫劳伦爱尔兰官方网站:Ralph Lauren爱尔兰
2020/04/10 全球购物
情侣吵架检讨书
2014/02/05 职场文书
企业业务员岗位职责
2014/03/14 职场文书
企业承诺书格式
2014/05/21 职场文书
2014年党课学习心得体会
2014/07/08 职场文书
四风问题民主生活会对照检查材料思想汇报
2014/09/27 职场文书
繁星春水读书笔记
2015/06/30 职场文书
《吃水不忘挖井人》教学反思
2016/02/22 职场文书
如何用JavaScript学习算法复杂度
2021/04/30 Javascript
Apache SeaTunnel实现 非CDC数据抽取
2022/05/20 Servers