jquery中的过滤操作详细解析

1.过滤 Filtering


































名称 说明 举例
eq( index ) 获取第N个元素 获取匹配的第二个元素:
$("p").eq(1)
filter( expr )

筛选出与指定表达式匹配的元素集合。

 保留带有select类的元素:
$("p").filter(".selected")
filter( fn )

筛选出与指定函数返回值匹配的元素集合

这个函数内部将对每个对象计算一次 (正如 '$.each'). 如果调用的函数返回false则这个元素被删除，否则就会保留。

 保留子元素中不含有ol的元素:

$("div").filter(function(index) {
  return $("ol", this).size() == 0;
});

is( expr )

注意: 这个函数返回的不是jQuery包装集而是Boolean值

用一个表达式来检查当前选择的元素集合，如果其中至少有一个元素符合这个给定的表达式就返回true。

如果没有元素符合，或者表达式无效，都返回'false'. 'filter' 内部实际也是在调用这个函数，所以，filter()函数原有的规则在这里也适用。

 由于input元素的父元素是一个表单元素，所以返回true:
$("input[type='checkbox']").parent().is("form")
map( callback )

将一组元素转换成其他数组（不论是否是元素数组）

你可以用这个函数来建立一个列表，不论是值、属性还是CSS样式，或者其他特别形式。这都可以用'$.map()'来方便的建立

 把form中的每个input元素的值建立一个列表:

$("p").append( $("input").map(function(){
  return $(this).val();
}).get().join(", ") );

not( expr ) 删除与指定表达式匹配的元素 从p元素中删除带有 select 的ID的元素:
$("p").not( $("#selected")[0] )

slice( start, end )

 选取一个匹配的子集 选择第一个p元素:
$("p").slice(0, 1);

赞 (0)

相关推荐

  • 从jquery的过滤器.filter()方法想到的

    最近发现了jquery的.filter()方法,这真是一个很强大的方法,最强大之处在于,他可以接受一个函数作为参数,然后根据函数的返回值判断,如果返回值是true,这个元素将被保留,如果返回值是false,这个元素将被剔除.这就是jquery选择器的过滤器. 空说无用,我们展示一下 复制代码 代码如下: <body> <p>你好啊,今天及多大了啊</p> <p><span>为什么要告诉你</span></p> </b

  • JQuery表格内容过滤的实现方法

    复制代码 代码如下: [html]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equ

  • jQuery之过滤元素操作小结

    jQuery之过滤元素操作小结

    1:eq(index)方法 用于获取第N个元素,这个元素的位置从0开始算起,语法格式如下:eq(index) 获取第3个表格,并将它的背景色设置为"#FCF", 代码如下:$("td").eq(2).css("background", "#FCF"); 2:filter(expr)方法 用于筛选出与指定表达式匹配的元素集合,用于缩小匹配的范围,用逗号分隔多个表达式,那么多个表达式之间是"或"的关系, 语法如

  • JQuery 选择器、过滤器介绍

    JQuery 选择器、过滤器介绍

    今日的学习再结合昨天的JavaScriptDOM的内容,让我对此十分清晰.JQuery原则:"write less, do more.",这句话已充分说明它对简化使用JavaScriptDOM编程的功力! 每位老师都有自己的教学方式,可能根据教授的内容的不同教学方式也有轻微的变化.老佟是一位非常有经验的软件教师,之前他在大连的软件公司做培训.经过多年的总结,他已经有自己一套成熟的教学方式.这个方式让我十分喜欢!至于是什么方式,你自己来体验吧!哈哈~~ 从学习JavaWEB.Struts

  • jquery中的过滤操作详细解析

    1.过滤 Filtering 名称 说明 举例 eq( index ) 获取第N个元素 获取匹配的第二个元素: $("p").eq(1) filter( expr ) 筛选出与指定表达式匹配的元素集合. 保留带有select类的元素: $("p").filter(".selected") filter( fn ) 筛选出与指定函数返回值匹配的元素集合 这个函数内部将对每个对象计算一次 (正如 '$.each'). 如果调用的函数返回false则这

  • 详解jQuery中的DOM操作

    详解jQuery中的DOM操作

    大致介绍 jQuery作为JavaScript库,继承并发扬了JavaScript对DOM对象操作的特性,使开发人员能方便的操作DOM对象. jQuery中的DOM操作 看看DOM操作都有哪些 逐一来看 先写一份HTML代码,后面的代码将操作这份HTML代码 <p title="选择你最喜欢的水果">你最喜欢的水果?</p> <ul> <li title="苹果">苹果</li> <li title=

  • JQuery中基础过滤选择器用法实例分析

    本文实例讲述了JQuery中基础过滤选择器用法.分享给大家供大家参考.具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <he

  • jQuery中iframe的操作(点击按钮新增窗口)

    jQuery中iframe的操作(点击按钮新增窗口)

    <iframe>也应该是框架的一种形式,它与<frame>不同的是,iframe可以嵌在网页中的任意部分. 今天遇到一个问题:怎样实现点击一个按钮,在当前的页面上新增加一个小窗口,展示一个图片信息? 如下图所示: 点击之前: 单击之后: 分析:要使新增的小窗口不影响父页面,我们这里采用iframe的框架的技术. [<iframe>也应该是框架的一种形式,它与<frame>不同的是,iframe可以嵌在网页中的任意部分.] 实现是思路:(1)在按钮的上添加一个

  • jQuery学习笔记[1] jQuery中的DOM操作

    DOM分为3个方面,即DOM Core,HTML-DOM,CSS-DOM. 1,DOM Core并不专属于JavaScript,任何一种支持DOM的程序设计语言都可以使用它. JavaScript中的getElementById(),getElementsByTagName()...等方法. 例如:使用DOM Core来获取表单对象的方法: document.getElementsByTagName("form"); 2,HTML-DOM. 在使用JavaScript和DOM为HTML

  • jQuery中$.grep() 过滤函数 数组过滤

    <pre code_snippet_id="1998964" snippet_file_name="blog_20161122_1_1873395" name="code" class="html">var = $.grep([1,32,5,63,8,4,-8,-5,2,56,9,62,-6],function (n , i){ if(n>50){ return n; } }); console.log(te

  • JQuery中Ajax的操作完整例子

    Java软件开发中,后台中我们可以通过各种框架,像SSH等进行对代码的封装,方便我们对Java代码的编写,例如,Struts,SpringMVC对从前台到action的流程进行封装控制,使我们只需要进行一些简单配置就可以实现:而spring进行了对各种对象的管理进行封装,提供了AOP编程的方式,大大方便了我们:而hibernate和IBatis则是对JDBC代码进行封装,不需要我们每次都写那些重复而繁杂的JDBC代码. 前台呢,对于页面一些效果,验证等,我们都是通过JavaScript语言进行完

  • jQuery中的select操作详解

    下面给大介绍了jquery对select的操作介绍,非常不错,具有内容介绍如下所示: select的html标签如下: <select class="xxx" id="yyy"><option></option>...<option></option></select> 1.设置value为"lll"的option选中 $('#yyy').val("lll"

  • JQuery中属性过滤选择器用法实例分析

    本文实例讲述了JQuery中属性过滤选择器用法.分享给大家供大家参考.具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <he

  • jQuery中DOM树操作之使用反向插入方法实例分析

    本文实例讲述了jQuery中DOM树操作之使用反向插入方法.分享给大家供大家参考.具体分析如下: 使用反向插入方法 这里我们先把创建的内容插人到元素前面,然后再把同一个元素插人到文档 中的另一个位置.通常,当在jQuery中操作元素时,利用连缀方法更简洁也更有效.可是我们现在没有办法这样做,因为this是.insertBefore()的目标,是.appendTo()的内容.此时,利 用反向插入方法,可以帮我们解决问题. 像.insertBefore()和.appendTo()这样的插人方法,一般

随机推荐