map方法,以及filter方法的使用
map()方法,会返回一个 jQuery 封装的数组,
这个数组不能直接使用,需要使用 get() 来处理返回的对象以得到基础的数组。
例子:
<!DOCTYPE html>
<html>
<head>
<style>p { color:red; }</style>
<script type="text/javascript" src="/jquery/jquery.js"></script>
</head> <body>
<p><b>Values: </b></p>
<form>
<input type="text" name="name" value="John"/>
<input type="text" name="password" value="password"/>
<input type="text" name="url" value="http://w3school.com.cn/"/>
</form> <script>
$("p").append( $("input").map(function(){
return $(this).val();
}).get().join(", ") );
</script> </body>
</html>
效果:
过程:首先通过map,得到val值的,jquery封装后的数组,但是这个数组不能直接使用,通过get()方法后才能变成数组对象,然后通过Join分割。
filter,过滤。
filter() 方法将匹配元素集合缩减为匹配指定选择器的元素。
get() 方法
获得第一个 p 元素的名称和值:
$("button").click(function(){
x=$("p").get(0);
$("div").text(x.nodeName + ": " + x.innerHTML);
});
get() 方法获得由选择器指定的 DOM 元素。
map方法,以及filter方法的使用的更多相关文章
- 数组map()方法和filter()方法及字符串startsWith(anotherString)和endsWith(anotherString)方法
map方法的作用不难理解,"映射"嘛,也就是原数组被"映射"成对应新数组 var newArr = arr.map(function() {});例子: var ...
- 基于jquery的has()方法以及与find()方法以及filter()方法的区别详解
has(selector选择器或DOM元素) 将匹配元素集合根据选择器或DOM元素为条件,检索该条件在每个元素的后代中是否存在,将符合条件的的元素构成新的结果集. 下面举一个例子: <ul& ...
- 图解get方法与filter方法
在django的数据库查找方法中,get与filter方法是查找单目数据,用图记录了这两个方法查找数据各自返回的是什么?
- javaScript 的 map() reduce() foreach() filter()
map(映射), reduce(规约), forEach(遍历), filter(过滤),它们都是高阶函数,都是以传入不同的函数来以不同的方式操作数组元.ie都不支持 一.map方法 *概述 map( ...
- Array 的五种迭代方法 -----every() /filter() /forEach() /map() /some()
ES5定义了五个迭代方法,每个方法都接收两个参数:要在每一项上运行的函数和运行该函数的作用域对象(可选的),作用域对象将影响this的值.传入这些方法中的函数会接收三个参数:数组的项的值.该项在数组中 ...
- 5个现在就该使用的数组Array方法: indexOf/filter/forEach/map/reduce详解(转)
ECMAScript5标准发布于2009年12月3日,它带来了一些新的,改善现有的Array数组操作的方法.然而,这些新奇的数组方法并没有真正流行起来的,因为当时市场上缺乏支持ES5的浏览器. ...
- JS中map、some、every、filter方法
简介 every()方法用于检测数组中所有元素是否都符合指定条件,若符合返回true,否则返回false:不会对空数组进行检测,不会改变原来的数组. some()方法用于检测数组中的元素是否有满足指定 ...
- 引用、浅拷贝及深拷贝 到 Map、Set(含对象assign、freeze方法、WeakMap、WeakSet及数组map、reduce等等方法)
从引用聊到深浅拷贝,从深拷贝过渡到ES6新数据结构Map及Set,再到另一个map即Array.map()和与其类似的Array.flatMap(),中间会有其他相关话题,例如Object.freez ...
- 遍历map的四种方法
方法一 在for-each循环中使用entries来遍历这是最常见的并且在大多数情况下也是最可取的遍历方式.在键值都需要时使用.注意:for-each循环在Java 5中被引入所以该方法只能应用于j ...
随机推荐
- ubuntu 启动 重启 停止 apache
一.Start Apache 2 Server /启动apache服务 # /etc/init.d/apache2 start or $ sudo /etc/init.d/apache2 start ...
- java中集合里的泛型
import java.util.ArrayList;/* * 泛型 : java jdk1.5新特性. * 泛型的好处 : * 1.将运行时的错诶提前到编译时. * 2.避免无谓的强制类型转换. * ...
- c++ primer敲代码第二章
今天越来越发现 学习一门编程语言,没有大量的code实践是不行的.看得快忘得更快.痛下决心,把primer的code习题一一实现. 习题2.11 底数和指数,求结果 #include <iost ...
- NOIP 2015 跳石头
题目背景 一年一度的“跳石头”比赛又要开始了! 题目描述 这项比赛将在一条笔直的河道中进行,河道中分布着一些巨大岩石.组委会已经选择好了两块岩石作为比赛起点和终点.在起点和终点之间,有 N 块岩石(不 ...
- Codeforces 915 E Physical Education Lessons
题目描述 This year Alex has finished school, and now he is a first-year student of Berland State Univers ...
- Codeforces 138D World of Darkraft(Multi-Nim)
[题目链接] http://codeforces.com/problemset/problem/138/D [题目大意] H*W的棋盘中每个点都是L.R.X三者之一,两人轮流选一个点, 若为L则向左下 ...
- 【kmp算法】hdu4763 Theme Section
kmp中next数组的含义是:next[i]表示对于s[0]~s[i-1]这个前缀而言,最大相等的前后缀的长度是多少.规定next[0]=-1. 迭代for(int i=next[i];i!=-1;i ...
- angualrjs2教程
1.一本本开源的Angular2书籍:https://zhangchen915.gitbooks.io/angular2-training/ 2.好的博客教程,讲的通俗易懂:http://codin. ...
- Activity组件(传递数据)
(一) 1.效果图:点击按钮“调用第二个Activity”,转到第二页面,之后点击“返回数据”,将第二个页面的数据传到第一个页面 2. activity_main.xml <?x ...
- WCF服务测试工具
官网地址:http://www.wcfstorm.com/wcf/home.aspx WCFStorm Lite 来进行接口查看及调试,如下所示.