filter() 方法将匹配元素集合缩减为匹配指定选择器的元素。
例如:
改变所有 div 的颜色,然后向类名为 "middle" 的类添加边框:
$("div").css("background", "#c8ebcc")
.filter(".middle")
.css("border-color", "red");

注意:filter和find的区别
例如: $("div").filter(".rain"); 和 $("div").find(".rain");
find()会在div元素内寻找class为rain 的元素,是对它的子集操作
filter()则是筛选div的class为rain的元素,是对它自身集合元素筛选

$.grep() 函数使用指定的函数过滤数组中的元素,并返回过滤后的数组。
提示:源数组不会受到影响,过滤结果只反映在返回的结果数组中。
语法
$.grep( array, function [, invert ] )
特别注意:Function类型 指定的过滤函数。grep()方法为function提供了两个参数:其一为当前迭代的数组元素,其二是当前迭代元素在数组中的索引。
例如: 输出 5,8
$(function () {
var arr =$.grep( [1,5,8], function(n,i){
return n > 4;
});
$( "p" ).text( arr.join( ", " ) );
})

$.grep() 根据条件过滤,所以函数中为bool类型的表达式,而map()  则是返回一个对象或者值;

map() 把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象。
由于返回值是 jQuery 封装的数组,使用 get() 来处理返回的对象以得到基础的数组。
$("p").append( $("input").map(function(){
return $(this).val();
}).get().join(", ") );

get() 方法获得由选择器指定的 DOM 元素。 与 ajax - get() 方法 没有关系,两个不相关。
语法
$(selector).get(index)
例如:
获得第一个 p 元素的名称和值:
$("button").click(function(){
x=$("p").get(0);
$("div").text(x.nodeName + ": " + x.innerHTML);
});
或者:
$("button").click(function(){
x=$("p").eq(0);
$("div").text($(x).prop("tagName")+ ": " + $(x).html());
});

jQuery中get()和eq(的区别)
eq返回的是一个jquery对象 get返回的是一个html 对象数组
返回的是jQuery对象,就可以继续调用其他方法,返回的是html数组就不能调用jQuery的其他方法
例如:
$("ul li").get(1).css("color", "red"); //这个是错误的
$("ul li").eq(1).css("color", "red"); //这个是正确的

Jquery的获取元素标签名称的方法:
$( this ).prop("nodeName")

jQuery DOM 元素方法

函数 描述
.get() 获得由选择器指定的 DOM 元素。
.index() 返回指定元素相对于其他指定元素的 index 位置。
.size() 返回被 jQuery 选择器匹配的元素的数量。
.toArray() 以数组的形式返回 jQuery 选择器匹配的元素。

JQuery 遍历 操作数组 map、grep、filter 的区别的更多相关文章

  1. Jquery遍历筛选数组的几种方法和遍历解析json对象|Map()方法详解

    Jquery遍历筛选数组的几种方法和遍历解析json对象|Map()方法详解 一.Jquery遍历筛选数组 1.jquery grep()筛选遍历数组 $().ready( function(){ v ...

  2. JQuery遍历json数组的3种方法

    这篇文章主要介绍了JQuery遍历json数组的3种方法,本文分别给出了使用each.for遍历json的方法,其中for又分成两种形式,需要的朋友可以参考下 一.使用each遍历 $(functio ...

  3. jquery遍历集合&数组&标签

      jquery遍历集合&数组的两种方式 CreateTime--2017年4月24日08:31:49Author:Marydon 方法一: $(function(){ $("inp ...

  4. JS002. map( ) 和 filter( ) 的区别和实际应用场景(递归函数、深度优先搜索DFS)

    在开发过程中难免会碰到省市区级联的操作,一般后端人员是不愿意将中文储存在数据库的. 由于应用页面较多,我们在通过区域Code写查字典函数时应该注意函数的 时间复杂度 / 空间复杂度. 如果用三层for ...

  5. jquery遍历对象,数组,集合

    1.jquery 遍历对象 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTM ...

  6. jquery遍历筛选数组的几种方法和遍历解析json对象

    jquery grep()筛选遍历数组 $().ready(    function(){        var array = [1,2,3,4,5,6,7,8,9];        var fil ...

  7. jQuery 遍历 (each、map)

    jQuery 遍历,意为“移动”,用于根据其相对于其他元素的关系来“查找”(或选取)HTML 元素.以某项选择开始,并沿着这个选择移动,直到抵达您期望的元素为止. jQuery 遍历函数 jQuery ...

  8. 【转】 jquery遍历json数组方法

    $(function () { var tbody = ""; //------------遍历对象 .each的使用------------- //对象语法JSON数据格式(当服 ...

  9. jQuery遍历Json数组

    var jsonArray=  [{ "name": "张三", "password": "123456"},{ &qu ...

随机推荐

  1. 阿里云ecs自动创建快照教程

    最近在一个博客联盟的微信群里面看到经常有朋友问阿里云的ecs服务器怎么设置自动创建快照,也不知道最近是怎么了,看到问这个问题的朋友有有四五个左右了,今天就特意到博客里来费大家分享设置自动创建快照的方法 ...

  2. Node express post 大小设置

    body-parser 默认限制了body长度 var bodyParser = require('body-parser'); app.use(bodyParser.json({"limi ...

  3. CNN-4: GoogLeNet 卷积神经网络模型

    1.GoogLeNet 模型简介 GoogLeNet 是2014年Christian Szegedy提出的一种全新的深度学习结构,该模型获得了ImageNet挑战赛的冠军. 2.GoogLeNet 模 ...

  4. PAT甲级 图 相关题_C++题解

    图 PAT (Advanced Level) Practice 用到图的存储方式,但没有用到图的算法的题目 目录 1122 Hamiltonian Cycle (25) 1126 Eulerian P ...

  5. PostgreSql-psql命令的使用

    安装好postgresql后,将路径:安装路径\bin,添加到环境变量path中,这样才有了使用psql命令的前提. 使用psql命令时,不需要进入postgresql数据库,直接在命令行使用即可,若 ...

  6. linux-centos7安装Oracle11gr2数据库(在图形界面下)

    修改操作系统核心参数 在Root用户下执行以下步骤: 1)修改用户的SHELL的限制,修改/etc/security/limits.conf文件 oracle soft nproc 2047 orac ...

  7. 导出excel的功能效果实现

    <el-button @click="exportExcel" > <i style="display: inline-block;"> ...

  8. Spring (3)框架

    Spring第三天笔记 今日内容 Spring的核心之一 -  AOP思想 (1) 代理模式- 动态代理 ① JDK的动态代理 (Java官方) ② CGLIB 第三方代理 (2) AOP思想在Spr ...

  9. CMake入门-04-自定义编译选项

    工作环境 系统:macOS Mojave 10.14.6 CMake: Version 3.15.0-rc4 Hello,World! - 自定义编译选项 CMake 允许为项目增加编译选项,从而可以 ...

  10. java 框架-模板引擎FreeMarker

    https://www.cnblogs.com/itdragon/p/7750903.html FreeMarker是一个很值得去学习的模版引擎.它是基于模板文件生成其他文本的通用工具.本章内容通过如 ...