js遍历数组和遍历对象的区别(动态生成ul li)
js遍历数组和遍历对象的区别(动态生成ul li)
leona_lily 发表于3年前
js遍历数组和遍历对象的区别(动态生成ul li)
  • 发表于 3年前
  • 阅读 6
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 新注册用户 域名抢购1元起>>>   

摘要: JavaScript ul li

JavaScript:

<script>
    //----------------for用来遍历数组对象--
    var i,myArr = [1,2,3];
    for (var i = 0; i < myArr.length; i++) {
        console.log(i+":"+myArr[i]);
    };
    //---------for-in 用来遍历非数组对象
    var man ={hands:2,legs:2,heads:1};
    //为所有的对象添加clone方法,即给内置原型(object,Array,function)增加原型属性,该方法很强大,也很危险
    if(typeof Object.prototype.clone ==="undefined"){
        Object.prototype.clone = function(){};    
    }
    //    for(var i in man){
        if (man.hasOwnProperty(i)) { //filter,只输出man的私有属性
            console.log(i,":",man[i]);
        };
    }
    //输出结果为print hands:2,legs:2,heads:1

    for(var i in man) {//不使用过滤
        console.log(i,":",man[i]);
    }    
    //输出结果为
    //hands : 2 index.html:20
    //legs : 2 index.html:20
    //heads : 1 index.html:20
    //clone : function (){} 
    for(var i in man) {
        if(Object.prototype.hasOwnProperty.call(man,i)) { //过滤
            console.log(i,":",man[i]);
        }
    }

   //输出结果为print hands:2,legs:2,heads:1

</script>
html:

<htmL>
<head>
<meta content="text/html;charset=utf-8" http-equiv="content-type">
    <script type="text/javascript">
    window.onload = function(){
        var arrLi = {我的朋友:['哇哈哈','乐百氏','农夫山泉'],同学:['咖啡','果汁','果酒']};
        var n = -1
        for(var i in arrLi){
            n++;
            document.body.innerHTML += '<ul>'+i+'</ul>';
            var ul = document.getElementsByTagName('ul');
            for (var j = 0; j < arrLi[i].length; j++) {
                ul[n].innerHTML += '<li>'+arrLi[i][j]+'</li>';
            };
        }
    }
    </script>
</head>
<body>

</body>
</htmL>



标签: JavaScript
共有 人打赏支持
粉丝 9
博文 91
码字总数 37807
×
leona_lily
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: