jquery中filter(fn)的使用研究

最新推荐文章于 2022-10-08 10:20:21 发布
最新推荐文章于 2022-10-08 10:20:21 发布
阅读量109 收藏
点赞数
文章标签： xhtml javascript c# ViewUI

jquery中filter(fn)给出的官方说明是：

 

筛选出与指定函数返回值匹配的元素集合
这个函数内部将对每个对象计算一次 (正如 '$.each'). 如果调用的函数返回false则这个元素被删除，否则就会保留。
 
这个说明没有问题，可是给出的例子却有问题。例子是

HTML 代码:

<p><ol><li>Hello</li></ol></p><p>How are you?</p>

jQuery 代码:

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

结果:

[ <p>How are you?</p> ]
 
可是大家在试的时候会发现，<p>中是不让放<ol>的，在一些浏览器会报错。
 
我在自己的一个程序中，用到了filter(fn)这个方法。我就把我使用的例子放出来。
 
我要做的功能其实很简单，就是要把一个页面中所有的<div>内容显示出来。这里面有些<div>的内容是动态加载的。
 
[c-sharp]  view plaincopy
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JqeryClick.aspx.cs" Inherits="AJAXEnabledWebApplication1.JqeryClick" %>  
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  3. <html xmlns="http://www.w3.org/1999/xhtml" >  
  4. <head runat="server">  
  5.     <title>无标题页</title>  
  6.       
  7.       
  8.     <mce:script src="jquery-1.3.2.min.js" mce_src="jquery-1.3.2.min.js" type="text/javascript"></mce:script>  
  9.       
  10.       
  11.     <mce:script type="text/javascript"><!--  
  12.        $(function(){  
  13.           $("#btn").click(function(){  
  14.             
  15.             //在ViewDiv中显示二种下拉列表当前被选中的内容。显示出来的是value值。  
  16.             $("#ViewDiv").html($("#ddlSel").val() + "-----" + $("#Select1").val());  
  17.               
  18.               
  19.             //这里有一点我要说明的事，我使用的.aspx文件，这种文件会在<form>内自己生成自己的几个<div>，它不是我要取的  
  20.             //所以在这里我加了一个大的div来取我们所要的。  
  21.               
  22.             //这里用filter(fn)来过滤掉里面包含ol的项  
  23.             $("#all").children("div").filter(function(index) {  
  24.                     return $("ol", this).size() == 0;  
  25.             }).each(function(index){  
  26.               
  27.             //这里显示出这些div的内容。请注意，在这里我们用  
  28.             //$("div",this).html()这种方法  
  29.                alert($("#"+this.id+"").html());  
  30.             });   
  31.           })  
  32.        })  
  33.       
  34. // --></mce:script>  
  35. </head>  
  36. <body>  
  37.     <form id="form1" runat="server">  
  38.     <div id="all">  
  39.     <div id="one">  
  40.         <asp:DropDownList ID="ddlSel" runat="server">  
  41.             <asp:ListItem Value="1">第一项</asp:ListItem>  
  42.             <asp:ListItem Value="2">第二项</asp:ListItem>  
  43.         </asp:DropDownList>  
  44.         <select id="Select1">  
  45.             <option value="3">第三项</option>  
  46.             <option value="4">第四项</option>  
  47.         </select>  
  48.         <input id="btn" type="button" value="显示信息" /></div>  
  49.       
  50.     <div id="ViewDiv"></div>  
  51.       
  52.       
  53.       
  54.     <div id="2"><ol><li>Hello</li></ol></div><div id="1">How are you?</div>   
  55.       
  56.     </div>  
  57.     </form>  
  58. </body>  
  59. </html>  
weixin_34306593
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
select懒加载组件
07-14
Vue
jQuery核心源码中文注释解读
06-21
jQuery的`extend`方法用于合并对象，它既可以用作类方法（`jQuery.extend`），也可以用作实例方法（`jQuery.fn.extend`），这实现了jQuery的继承机制。 ```javascript jQuery.extend = jQuery.fn.extend = function...
jquery 遍历 filter(fn)
KAXU
12-26 151
filter(fn) 将匹配元素集合中不满足‘fn函数’匹配的元素集合删除，形成新的元素集合 &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt; &lt;html&gt; &lt;head&g...
jquery中filter(fn)的使用
我本无名的专栏
05-09 5590
jquery中filter(fn)给出的官方说明是： 筛选出与指定函数返回值匹配的元素集合这个函数内部将对每个对象计算一次 (正如 $.each). 如果调用的函数返回false则这个元素被删除，否则就会保留。这个说明没有问题，可是给出的例子却有问题。例子是HTML 代码:HelloHow are you? jQuery 代码:$("
jQuery中$.extend
06-10 132
$.fn是指jquery的命名空间，加上fn上的方法及属性，会对jquery实例每一个有效。 如扩展$.fn.abc(),即$.fn.abc()是对jquery扩展了一个abc方法,那么后面你的每一个jquery实例都可以引用这个方法了. 那么你可以这样子：$("#div").abc(); jQuery为开发插件提拱了两个方法，分别是： jQuery.extend(object);为扩展...
jQuery中$.fn的用法示例介绍
谦虚使人发胖的博客
11-20 763
$.fn是指jquery的命名空间，加上fn上的方法及属性，会对jquery实例每一个有效。 如扩展$.fn.abc(),即$.fn.abc()是对jquery扩展了一个abc方法,那么后面你的每一个jquery实例都可以引用这个方法了. 那么你可以这样子：$("#div").abc();  jQuery为开发插件提拱了两个方法，分别是： jQuery.extend(obj
jQuery的使用方法例子
12-04
以上只是jQuery核心API的一部分，实际使用中还有更多的方法和功能，如AJAX的全局事件、插件机制等。通过熟练掌握这些基础API，开发者可以轻松实现网页的动态交互，提高开发效率。在实际项目中，配合详细的文档和示例...
jquery中的过滤操作详细解析
01-19
filter( fn ) 筛选出与指定函数返回值匹配的元素集合 这个函数内部将对每个对象计算一次 (正如 ‘$.each’). 如果调用的函数返回false则这个元素被删除，否则就会保留。 保留子元素中不含有ol的元素: $(“div”)....
JQuery新版中文手册
05-14
filter(expr|obj|ele|fn) is(expr|obj|ele|fn)1.6* map(callback) has(expr|ele) not(expr|ele|fn) slice(start,[end]) 查找 children([expr]) closest(expr,[con]|obj|ele)1.6* find(expr|obj|ele)1.6* ...
jQuery1.4.1 API 中文参考手册
01-30
《jQuery1.4.1 API 中文参考手册》是一份为开发者提供的详尽指南，它涵盖了jQuery库在1.4.1版本中的各种函数、方法和事件，是快速理解和使用jQuery的强大工具。这份手册通常以CHM（Compiled Help Manual）格式提供，...
7. 过滤器的使用 -- filter
Twelve_Y的博客
11-23 212
vue 过滤器官网 过滤器 专门对变量的原始值先加工再显示的一种特殊函数。 创建 全局过滤器 Vue.filter('过滤器名', function (旧值) { return 新值; }) 使用 <元素>{{ 变量名 | 过滤器名 }}</元素> 组件间的过滤器 filters: { capitalize: function (旧值) { return 新值; } } Vue.filter(‘capitalize’, function (value)
element color-picker源码
weixin_30951389的博客
05-29 493
src/main.vue <template> <div :class="[ 'el-color-picker', colorDisabled ? 'is-disabled' : '', colorSize ? `el-color-picker--${ colorSize }` : '' ]" v...
python中的几个函数解释 map、reduce、filter、yeild、sorted、eval
wyy_a的博客
12-28 621
目录 map(fn,Iterable) reduce(fn,Iterable) filter(fn，Iterable) yield n map(fn,Iterable) fn是一个函数名，Iterable是一个迭代对象，可以是list，str，map使用Iterable的元素调用fn函数然后返回一个Iterable 返回的Iterable可以使用list,str给转化一下类型 ''' 示例1将整数数组元素依次调用fun函数，函数中对每一...
Python 回调函数
最新发布
qq_45876716的博客
10-08 122
记录python知识点
Linux内核：网络过滤器简介与示例代码
liu605925527的博客
10-22 512
转载：Linux内核：网络过滤器简介与示例代码_RToax-CSDN博客 #include <linux/module.h> #include <linux/skbuff.h> #include <linux/init.h> #include <net/sock.h> #include <linux/inet.h> #include <linux/ip.h> #include <li...
jQuery中filter()和find()和has()的用法区别
逸尘的专栏
03-12 7562
filter()、find()、has()是jquery中常用得三个函数，用法以及效果截然不同，对于初学者来说，往往分不清楚，关于三个函数的用法，简单解释一下。filter()方法-filter()过滤DOM元素包装集，是指操作当前元素集，删除不匹配的元素，得到一个新的集合。<ul> <li class="a">list item 1</li> <li>list item 2 <ul
jQuery实战中文资源大放送
通过jQuery，你可以轻松选择页面中的元素，如使用"$()"选择器选取元素，并进行添加、删除或修改元素的操作。例如，`$("#id")`可以选取ID为"id"的元素，`$(".class")`则选取所有class为"class"的元素。jQuery还支持更...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值