• 技术文章 >web前端 >前端问答

    jquery中each是什么意思

    长期闲置长期闲置2022-05-10 14:43:54原创239

    在jquery中,each是“循环遍历一组元素”的意思;each()方法的作用就是遍历指定的对象和数组,相当于程序中的for循环,返回false可用于及早停止循环,语法为“$.each(需要遍历的对象或数组,用于循环执行的函数)”。

    本教程操作环境:windows10系统、jquery3.2.1版本、Dell G3电脑。

    jquery中each是什么意思

    是循环遍历所选择到的一组元素的意思,相当于程序中的for循环

    jQuery.each() 函数用于遍历指定的对象和数组。

    语法

    $.each( object, callback )

    object Object类型 指定需要遍历的对象或数组。

    callback Function类型 指定的用于循环执行的函数。

    each() 方法规定为每个匹配元素规定运行的函数。

    提示:返回 false 可用于及早停止循环。

    示例如下:

    遍历数组:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>123</title>
    <style>
    div {
    color: blue;
    }
    div#five {
    color: red;
    }
    </style>
    <script src="js/jquery.min.js"></script>
    </head>
    <body>
     
    <div id="one"></div>
    <div id="two"></div>
    <div id="three"></div>
    <div id="four"></div>
    <div id="five"></div>
    <script>
    $(function () { 
    var arr = [ "one", "two", "three", "four", "five" ];
    var obj = { one: 1, two: 2, three: 3, four: 4, five: 5 };
    $.each( arr, function( i, val ) {
    $( "#" + val ).text( "我的是 " + val + "." );
    // 在 "three" 之后将停止运行
    return ( val !== "three" );
    });
    $.each( obj, function( i, val ) {
    $( "#" + i ).append( document.createTextNode( " - " + val ) );
    });
    })
    </script>
     
    </body>
    </html>

    输出结果:

    07.png

    遍历对象:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>123</title>
    <script src="js/jquery.min.js"></script>
    </head>
    <body>
    <script>
    $(function () { 
    var obj = {
    "flammable": "inflammable",
    "duh": "no duh"
    };
    $.each( obj, function( key, value ) {
    alert( key + ": " + value );
    });
    })
    </script>
     
    </body>
    </html>

    输出结果:

    08.png

    09.png

    相关视频教程推荐:jQuery视频教程

    以上就是jquery中each是什么意思的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:jquery
    上一篇:jquery中html方法实现了哪些功能 下一篇:jquery选择器的几种类型是什么
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【腾讯云】年中优惠,「专享618元」优惠券!• jquery有几个基本选择器• jquery怎么用CSS()设置鼠标禁止样式• jquery中有map方法吗• jquery怎么用click改变id• jquery中attr和val的区别是什么
    1/1

    PHP中文网