jQuery内置函数map和each的用法

    xiaoxiao2021-03-25  121

    $.map的运用 var arr1 = [0, 3, 5]; var arr2 = $.map(arr1, function (item) { return item * 2 }); alert(arr2);

    结果:0 6 10

     

    $.each的运用

     

    普通数组 var arr1 = [0, 3, 5];

    $.each(arr1,function (i) {

    alert(arr1[i]);

    });

    结果:0,3,5

     

     

    json对象

    var jsonData = {"tom": 20, "jerry": 21 };

    $.each(jsonData,function (key, value) {

         alert(key + "_" + value); });

    结果:tom_20, jerry_21

     

    $.each(jsonData,function (i) {

         alert(jsonData[i]);

    });

    结果:20,21

     

     

    json对象数组($.getJSON里面常用)

    var jsonArray = [ { "tom": 20, "jerry": 21 }, { "tom": 22,"jerry": 23} ];

    $.each(jsonArray,function (i) {

      alert(jsonArray[i].tom);

    });

    结果:20,22

     

     

    看$.getJSON的一处应用:

    $.getJSON(     "stu/stu_toshowStu",      {classNum:classNum},      function(json,status)     {      $.each(json,function(i){       $('#stuDiv').append("<div>学生学号:"+json[i].num+"</div>");      }    );   });

    jQuery对象可以直接调用each:

    $("input").each(function(){

       $(this).val()........

    });

    each处理dom元素,此处以一个input表单元素作为例子。 <input name="aaa" type="hidden" value="111" /> <input name="bbb" type="hidden" value="222" /> <input name="ccc" type="hidden" value="333" /> <input name="ddd" type="hidden"  value="444"/> $.each($("input:hidden"), function(i,element){        alert(val);      alert(i);      alert(element.name);      alert(element.value);     });   alert(element)将输出[object HTMLInputElement],是一个表单元素 alert(i);将输出为0,1,2,3 alert(element.name);将输出aaa,bbb,ccc,ddd,若使用this.name将输出同样的结果 alert(element.value);将输出111,222,333,444,若使用this.value将输出同样的结果   $("input:hidden").each(function(i,element){     alert(i);     alert(element.name);     alert(element.value);        }); 输出结果相同

    当然比如$("input").css()等封装好的操作自动有一个遍历,就不需要手动遍历了。

    转载请注明原文地址: https://ju.6miu.com/read-11666.html

    最新回复(0)