jQuery的$().each()与$.each()的区别

 <!DOCTYPE html>

 <html>

 <head lang="en">

   <meta charset="UTF-8">

   <title></title>

   <style>

   </style>

 </head>

 <body>

 <ul id="list">

   <li>98</li>

   <li>85</li>

   <li>33</li>

   <li>99</li>

   <li>52</li>

   <li>95</li>

 </ul>

 <ul id="sort"></ul>

 <script src="js/jquery-1.11.3.js"></script>

 <script>

   //请给每个不足60分的成绩+10分，并将超过90分的成绩用绿色背景标识出来

   var arr=[];

   /*$(.).each()的用法

   $("#list>li").each(function(i,elem){

    //$(...).each()是只能用于jQuery的子对象中，定义于jQuery.fn原型对象中

     console.log(i,elem)

     var $elem=$(elem);

     var num=parseInt($elem.html());

        arr[i]=num;

     if(num<60){

       num+=10;

       $elem.html(num);

     }else if(num>=90) $elem.css("background","red");

     })

     */

     //$.each(,)的用法

     var lis=document.querySelectorAll("#list>li");

     $.each(lis,function(i,elem){

    //$(...).each()是只能用于jQuery的子对象中

     console.log(i,elem)

     var $elem=$(elem);

     var num=parseInt($elem.html());

        arr[i]=num;

     if(num<60){

       num+=10;

       $elem.html(num);

     }else if(num>=90) $elem.css("background","red");

     })

     var barr=arr.sort(function(a,b){return b-a;})

     var html="";

     //$.each是可以用于非jQuery的对象，是定义在构造函数上的静态函数，static

     $.each(barr,function(i,elem){

       html+=`<li>${elem}</li>`;

     });

     $("#sort").html(html);

 </script>

 </body>

 </html>

总结：

$(...).each()是只能用于jQuery的子对象中，定义于jQuery.fn原型对象中

$.each（）是可以用于非jQuery的对象，是定义在构造函数上的静态函数，static

巴特西

jQuery的$().each()与$.each()的区别

最新文章

热门文章