关于filter的使用先记录以下几点:

  1.filter(':even')遍历所有元素,找到index为偶数的元素。。 ps: filter(':odd')       odd----奇数   even---偶数

举例:

<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>
<li>list item 6</li>
</ul>

此时输出$('li').filter(':even').css('background-color','red');   则结果item 1 3  5会变成红色

  2.通过过滤函数,写法大致如此filter(function(index){})

具体例子如下:

<ul>
<li><strong>list</strong> item 1 - one strong tag</li>
<li><strong>list</strong> item <strong>2</strong>
- two <span>strong tags</span></li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
<li>list item 6</li>
</ul>

此时输出

$('li').filter(function(index) {
return $('strong', this).length == 1;
}).css('background-color', 'red');

,过滤函数判断$('strong')选择器输出的数据长度不为0,及不为空,也就是存在strong标签的li



												

【前端学习笔记】2015-09-02~~~~ 关于filter()匹配的使用的更多相关文章

  1. 【前端】Web前端学习笔记【1】

    ... [2015.12.02-2016.02.22]期间的学习笔记. 相关博客: Web前端学习笔记[2] 1. JS中的: (1)continue 语句 (带有或不带标签引用)只能用在循环中. ( ...

  2. 【前端】Web前端学习笔记【2】

    [2016.02.22至今]的学习笔记. 相关博客: Web前端学习笔记[1] 1. this在 JavaScript 中主要有以下五种使用场景 在全局函数调用中,this 绑定全局对象,浏览器环境全 ...

  3. Web前端学习笔记(001)

    ....编号    ........类别    ............条目  ................明细....................时间 一.Web前端学习笔记         ...

  4. web前端学习笔记

    web前端学习笔记(CSS盒子的定位) 相对定位 使用相对定位的盒子的位置常以标准流的排版方式为基础,然后使盒子相对于它在原本的标准位置偏移指定的距离.相对定位的盒子仍在标准流中,它后面的盒子仍以标准 ...

  5. 前端学习笔记汇总(之merge方法)

    学习笔记 关于Jquery的merge方法 话不多说,先上图 使用jquery时,其智能提示如上,大概意思就是合并first和second两个数组,得到的结果是first+(second去重后的结果) ...

  6. 大前端学习笔记整理【一】CSS盒模型与基于盒模型的6种元素居中方案

    概览 CSS盒模型,规定了元素框来处理元素的 内容.内边距.边框和外边距的方式 元素部分是指内容部分,也是最实际的内容,包围内容的称之为内边距,内边距外围是边框,边框外围就是外边距:且外边距是透明的, ...

  7. Caliburn.Micro学习笔记(一)----引导类和命名匹配规则

    Caliburn.Micro学习笔记目录 用了几天时间看了一下开源框架Caliburn.Micro 这是他源码的地址http://caliburnmicro.codeplex.com/ 文档也写的很详 ...

  8. 【前端学习笔记02】JavaScript字符串、数组的一些操作方法

    字符串操作: //str.length "micromajor".length // 10 //str.charAt() "micromajor".charAt ...

  9. web前端学习笔记:文本属性

    今天的web前端笔记主要讲述文本属性,希望能帮助到正在学习web前端开发的初学者们,废话不多说了,一起来看看文本属性的相关内容吧. 文本属性 文本缩进 将Web页面上的一个段落第一行缩进,这是一种最常 ...

随机推荐

  1. Mysql command line

    show databasename; use databasename; show tables; desc tablename;

  2. k8s1.13.0二进制部署-node节点(四)

    Master apiserver启用TLS认证后,Node节点kubelet组件想要加入集群,必须使用CA签发的有效证书才能与apiserver通信,当Node节点很多时,签署证书是一件很繁琐的事情, ...

  3. QT+event() + 事件过滤器

    其存在的意义: mywidget.h: #ifndef MYWIDGET_H #define MYWIDGET_H #include <QWidget> namespace Ui { cl ...

  4. Bootstrap历练实例:向列表组添加链接

    向列表组添加链接 通过使用锚标签代替列表项,我们可以向列表组添加链接.我们需要使用 <div> 代替 <ul> 元素.下面的实例演示了这点: <!DOCTYPE html ...

  5. ll1文法

    <program>-><external_declaration> | <program> <external_declaration> < ...

  6. 深入理解 hashcode 和 hash 算法

    深入理解 hashcode 和 hash 算法 2017年12月30日 23:06:07 阅读数:5197 标签: hashhashmaphashcode二进制 更多 个人分类: jdk-源码  ht ...

  7. destoon模块自定义字段的添加并让其支持搜索的方法

    今天看了看模块设置里的自定义字段功能的用法,试着加了个新字段glry,设置了值,然后去数据库moduleid的article表看,字段成功加上了. 于是去template下article文件夹的lis ...

  8. DeepFaceLab小白入门(3):软件使用!

    换脸程序执行步骤,大部分程序都是类似.DeepFaceLab 虽然没有可视化界面,但是将整个过程分成了8个步骤,每个步骤只需点击BAT文件即可执行.只要看着序号,一个个点过去就可以了,这样的操作应该不 ...

  9. 【TCP/IP】【网络基础】网页访问流程

    引用自 <鸟哥的linux私房菜> http://cn.linux.vbird.org/linux_server/0110network_basic_1.php#ps7 那 TCP/IP ...

  10. 7.Yii2.0框架自定义全局工具函数

    功能: 新建共用方法的打印方法,可以很方便的格式化打印 一.新建helper/function.php <?php /** * Created by Haima. * Author:Haima ...