关于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. 2018.5.13 oracle遇到的问题

    安装Oracle 11g 出现交换空间不够 在计算机那里右键打开属性进入高级系统设置然后找到第一个设置找到高级然后更改一下自定义范围(云服务器是16-10000) 然后确定 完成了. 快安装结束之后显 ...

  2. Ajax的原理及Django上传组件

    title: Ajax的原理及Django上传组件 tags: Django --- Ajax的原理及Django上传组件 Ajax的原理 ajax 是异步JavaScript和xml ajax就是向 ...

  3. 安装 Win7 的系统的时候如何分区

    解决方案 在安装Win7的系统的时候,可以使用下面方法进行分区: 1. 在出现同意许可条款,勾选“我接受许可条款(A)”后,点击下一步,然后继续下面操作: 2. 进入分区界面,点击“驱动器选项(高级) ...

  4. GIMP如何制作一只大佬猫头像

    新建文件File -> 设置宽度为24px,高度5px:高级选项中将背景图片设置为无色 使用铅笔,前景色设为黑色,画出眼镜的模样,画出反光效果:将前景色设为灰色 放大图片,右击空白区域-> ...

  5. DeepFaceLab小白入门(6):脸部替换以及合成视频!

    前面的都是准备工作,这个环节才是真的换脸.换脸主要分两部分,1,图片换脸,2,把图片合成视频. 7) convert H64 debug.bat 这个环节是和训练环节相对于的,比如我们之前选的是H64 ...

  6. 编译与安装 OpenSSL

    编译与安装 OpenSSL prefix 是安装目录,openssldir 是配置文件目录,另外建议安装两次,shared 作用是生成动态连接库.linux版的OpenSSL下载地址为:https:/ ...

  7. python输出mssql 查询结果示例

    # -*- coding: utf-8 -*-# python 3.6import pymssql conn=pymssql.connect(host='*****',user='******',pa ...

  8. Html5_css

    CSS 在标签上设置style属性: background-color: #2459a2; height: 48px; ... 编写css样式: 1. 标签的style属性 2. 写在head里面 s ...

  9. 欧拉函数:HDU3501-Calculation 2

    Calculation 2 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Probl ...

  10. 实践自己的WebSite______流水

    尝试从头至尾搭建一个MVC的网站,主要以流水的方式进行进度和记录,而不讨论技术的部分. 1,在Controller下创建两个文件夹,分别为sys和Business,分别对应于系统功能和业务逻辑.比如登 ...