for-in循环一看就懂

Ql19961130

已于 2023-09-02 15:59:10 修改

阅读量32

点赞数

文章标签： javascript

于 2023-08-19 15:23:57 首次发布

本文链接：https://blog.csdn.net/Ql19961130/article/details/132237619

版权

循环有很多种do/while循环 while循环普通也是最常用的for循环，突然想到for...in循环。

<div class="mm">
           <div>1</div>
           <div>2</div>
           <div>3</div>
           <br>
           <br>
       </div>
这段html代码是最基础的，用于将数据拼接在里面，js代码虽然重要，但是基础的代码也是很重要的

let box = [{
               name: "唐三",
               title: "唐门门主",
               nianl: 25
           }, {
               name: "小舞",
               title: "10万年",
               nianl: 100000
           }, {
               name: "消炎",
               title: "无尽火域大老板",
               nianl: 30
           }, {
               name: "测试",
               title: "一二三",
               nianl: 18
           }]
console.log(box);//在控制台查看状态是否成功，就是有没有报错之类的

做一段数组包对象的假数据用于拼接

fn();
           function fn() {
               let o = '';
               for (let i in box) {
                   o += `<div>${box[i].name}</div>
                   <div>${box[i].title}</div>
                   <div>${box[i].nianl}</div>
                   <br>
                   <br>`
                   $('.mm').eq(0).html(o);
               }
           }
这一段用于循环拼接

描述的不太清晰

下面是完全的代码

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8">
       <title>for-in循环</title>
       <script src="jquery-3.6.3.js"></script>
   </head>
   <body>
       <div class="mm">
           <div>1</div>
           <div>2</div>
           <div>3</div>
           <br>
           <br>
       </div>
       <script>
           //下方是一串数组包对象假数据
           let box = [{
               name: "唐三",
               title: "唐门门主",
               nianl: 25
           }, {
               name: "小舞",
               title: "10万年",
               nianl: 100000
           }, {
               name: "消炎",
               title: "无尽火域大老板",
               nianl: 30
           }, {
               name: "测试",
               title: "一二三",
               nianl: 18
           }]
console.log(box);
           fn();
           function fn() {
               let o = '';
               for (let i in box) {
                   o += `<div>${box[i].name}</div>
                   <div>${box[i].title}</div>
                   <div>${box[i].nianl}</div>
                   <br>
                   <br>`
                   $('.mm').eq(0).html(o);
               }
           }

       </script>
   </body>
</html>