zoukankan      html  css  js  c++  java
  • 3_5:遍历元素 + 处理数据

    1)概念

    //1 对一类元素做 同样的操作  用到了 隐式迭代
    
    //2 对一类元素做 不同的操作  用到了 遍历:

    2)基本语法

    $('div').each(function(index,domEle){});   //方法1 主要用于遍历元素
    
    $.each($('div'),function(index,domEle){}); //方法2 主要遍历数组 对象 处理数据

    3)遍历dom元素

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>遍历元素</title>
        <script src="jquery.min.js"></script>
    </head>
    <body>
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <script>
        //需求1:把每一个div的字体颜色做设置
        var arr = ['red','blue','green'];
        //需求2:把三个div里面的值加起来
        var sum = 0;
        $('div').each(function (index , domEle) {
            //回调函数第一个参数:一定是一个索引号
            //回调函数第二个参数:是一个dom元素对象 如果要使用jQuery对象的方法 需要进行对象装换
            $(domEle).css('color', arr[index]);//完成需求1
            //$(domEle);//把dom对象转换为jquery对象
            sum += parseInt($(domEle).text());//完成需求2
        });
        console.log(sum);
    </script>
    </body>
    </html>

    4)遍历数据

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>遍历数组 对象 处理数据</title>
        <script src="jquery.min.js"></script>
    </head>
    <body>
    <script>
        //遍历数组
        var arr = ['李白','杜甫','白居易','陶渊明'];
        $.each(arr,function (index,value) {
            //console.log(index);//index是每一个元素的索引号
            //console.log(value);//value是每一个元素的值
        });
        //遍历对象
        $.each({name:'李白',age:58},function (index, value) {
            console.log(index);//index 是属性名
            console.log(value);//value 是属性值
        });
    </script>
    </body>
    </html>
  • 相关阅读:
    葡萄城报表介绍:数据报表的七个原则
    while(scanf("%d",&n)!=EOF)
    不容易系列之(3)—— LELE的RPG难题
    错排公式
    _​_​i​n​t​6​4​ ​与​l​o​n​g​ ​l​o​n​g​ ​i​n​t
    杭电ACM 2046 阿牛的EOF牛肉串
    C++Builder 中使用 __int64 整数的问题
    折线分平面——杭电2050
    复合梯形公式与复合辛普森公式求积分
    两套蓝桥杯热身题
  • 原文地址:https://www.cnblogs.com/fuyunlin/p/14499853.html
Copyright © 2011-2022 走看看