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


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

    一、Jquery遍历筛选数组

    1、jquery grep()筛选遍历数组

    $().ready(
       function(){
           var array = [1,2,3,4,5,6,7,8,9];
           var filterarray = $.grep(array,function(value){
               return value > 5;//筛选出大于5的
           });
           for(var i=0;i<filterarray.length;i++){
               alert(filterarray[i]);
           }
           for (key in filterarray){
               alert(filterarray[key]);
           }
       }
    );
    

     
    2、jquery each()筛选遍历数组

    $().ready(
       function(){
           var anObject = {one:1,two:2,three:3};//对json数组each
           $.each(anObject,function(name,value) {
               alert(name);
               alert(value);
           });
           var anArray = ['one','two','three'];
           $.each(anArray,function(n,value){
               alert(n);
               alert(value);
           }
           );
       }
    );
    


    3、jquery inArray()筛选遍历数组

    $().ready(
       function(){
           var anArray = ['one','two','three'];
           var index = $.inArray(‘two’,anArray);
           alert(index);//返回该值在数组中的键值,返回1
           alert(anArray[index]);//value is two
       }
    );
    

     
    4、jquery map()筛选遍历数组

    $().ready(
       function(){
           var strings = ['0','1','2','3','4','S','6'];
           var values = $.map(strings,function(value){
                   var result = new Number(value);
                   return isNaN(result) ? null:result;//isNaN:is Not a Number的缩写
               }
           );
           for (key in values) {
               alert(values[key]);
           }
       }
    );
    

     
    二、遍历解析json对象

    var json = [{dd:'SB',AA:'东东',re1:123},{cccc:'dd',lk:'1qw'}];
    for(var i=0,l=json.length;i<l;i++){
       for(var key in json[i]){
           alert(key+’:'+json[i][key]);
       }
    }
    

     
    2、jquery遍历解析json对象2
    有如下 json对象:
    var obj ={”name”:”冯娟”,”password”:”123456″,”department”:”技术部”,”sex”:” 女”,”old”:30};
    遍历方法:

    for(var p in obj){
       str = str+obj[p]+’,’;
       return str;
    
    }
    

     
    三、Map()方法详解
    1、实例

    构建表单中所有值的列表:

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

     
    2、定义和用法

    map() 把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象。

    3语法

    .map(callback(index,domElement))

    参数
        

    描述

    callback(index,domElement)
        

    对当前集合中的每个元素调用的函数对象。

    详细说明

    由于返回值是 jQuery 封装的数组,使用 get() 来处理返回的对象以得到基础的数组。

    .map() 方法对于获得或设置元素集的值特别有用。请思考下面这个带有一系列复选框的表单:

    <form method="post" action="">
    
     <fieldset>
        <div>
          <label for="two">2</label>
          <input type="checkbox" value="2" id="two" name="number[]">
        </div>
        <div>
          <label for="four">4</label>
          <input type="checkbox" value="4" id="four" name="number[]">
        </div>
        <div>
          <label for="six">6</label>
          <input type="checkbox" value="6" id="six" name="number[]">
        </div>
        <div>
          <label for="eight">8</label>
          <input type="checkbox" value="8" id="eight" name="number[]">
        </div>
     </fieldset>
    
    </form>
    

     
    我们能够获得复选框 ID 组成的逗号分隔的列表:

    $(':checkbox').map(function() {
    
      return this.id;
    
    }).get().join(',');
    

     
    本次调用的结果是字符串:"two,four,six,eight"。
    在 callback 函数内部,this 引用每次迭代的当前 DOM 元素。该函数可返回单独的数据项,或者是要被插入结果集中的数据项的数组。如果返回的是数组,数组内的元素会被插入集合中。如果函数返回 null 或 undefined,则不会插入任何元素。

  • 相关阅读:
    初心不负 笔记-JS高级程序设计-引用类型篇-Array
    CSS-样式篇
    笔记-JS高级程序设计-变量,作用域和内存问题
    笔记-JS高级程序设计-基本概念篇
    WPF 10天修炼 第四天- WPF布局容器
    WPF 10天修炼 第三天- Application全局应用程序类
    WPF 10天修炼 第二天- XAML语言
    WPF 10天修炼 第一天- 入门
    C# 关于e.Handled 的说明
    C# Replace方法
  • 原文地址:https://www.cnblogs.com/sntetwt/p/4054387.html
Copyright © 2020-2023  润新知