ajax.三级联动和闭包简单理解

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        *{
            margin:0;
            padding:0;
        }

        select {
            height:30px;
            width:200px;
            line-height: 30px;
            text-align: center;
        }
        #province option{
            background-color: cornflowerblue;
        }

        #city option{
            background-color: rebeccapurple;

        }

        #area option{
            background-color: orangered;
        }

        option:hover{
            background-color: black;
            color:white;
        }

    </style>
</head>
<body>
<select id="province" οnchange=fn()></select>
<select id="city"  οnchange=ku()></select>
<select id="area"></select>
<script src="ajax.js"></script>
</body>
<script>
    //1:div a

    // ajax("post","province.json","data",function (uss) {
    //     var json=JSON.parse(uss);
    //     console.log(json);
    //     for(x in json){
    //         var a1=document.createElement("a");
    //         a1.innerHTML=json[x].name;
    //         a1.id=json[x].id;
    //         var gg=document.getElementById("province");
    //         gg.appendChild(a1);
    //         a1.addEventListener("click",function () {
    //             var cityID=this.id;
    //             ajax("post","city.json","data",function (sub) {
    //                 var cityDiv=document.getElementById("city");
    //                 cityDiv.innerHTML="";
    //                 var Json=JSON.parse(sub);
    //                 for(t in Json){
    //                     if(t==cityID){
    //                         for(z in Json[t]){
    //                             var aa1=document.createElement("a");
    //                             aa1.innerHTML=Json[t][z].name;
    //                             aa1.id=Json[t][z].id;
    //                             cityDiv.appendChild(aa1);

    // aa1.addEventListener("click",function () {
    //     var area=document.getElementById("area");
    //     var areaID=this.id;
    //     ajax("post","area.json","data",function (are) {
    //         var Json=JSON.parse(are);
    //         for(i in Json){
    //             if(i==areaID){
    //                 for(g in Json[i]){
    //                     var aaa1=document.createElement("a");
    //                     aaa1.innerHTML=Json[i][g].name;
    //                     area.appendChild(aaa1);
    //                 }
    //             }
    //         }
    //     })
    //
    // })

    //                         }
    //                     }
    //                 }
    //             })
    //         })
    //
    //     }
    // });
    //减少全局变量的使用
    //for in 循环key或索引值;少用
    //for(i=0;len=li.length;i<len;i++)//效率最快.14ms
    //for of 专门循环数组;value值;//不能循环object;
    //闭包就是能够读取其他函数内部函数的函数.最好是只访问;//
    //垃圾回收机制:标记清除, 引用计数(ie.objeect)
    //var a='1';
    // var arr=[];
    // a.b=1;
    // arr.b=1;
    //如果用.a.lengthjiu
    // console.log(a.b);//undefined;基本数据类型不可在加属性.
    // console.log(arr.b);//1;
    //( public void feel(string yy){
    //     string yy="blibli";
    // }
    // feel.yy==blibli)java
    //
     // window.οnlοad=function () {
     //     function fn1() {
     //         var a=1;
     //         a++;
     //         ++a;
     //         function fn2() {
     //             a=5;
     //             return fn3();
     //             function fn3() {
     //                 a+=4;
     //             }
     //         }
     //         return fn2;
     //     }
     //
     //     fn1()()//返回fn2().
     //
     //
     // }

    // var arr=[1,2,3,4];
    // var arr=new Array(1,2,3,4,5);
    // var obj={"name":"liming","age"}
    // for(x of arr){
    //     console.log(x);
    // }

    // 2:select:option
       var pro=document.getElementById("province");
       var cit=document.getElementById("city");
       var are=document.getElementById("area");

       ajax("post","province.json","data",function (uss) {
           var json=JSON.parse(uss);
           for(i in json){
               pro.innerHTML=`<option>${json[i].name}</option>`;
           }
       })
      ajax("post","city.json","data",function (abb) {
        var Json=JSON.parse(abb);
      })
       ajax("post","area.json","data",function (bbs) {
        var JSon=JSON.parse(bbs);
      })

    function fn(){
         for(x in json) {
               var index = pro.selectedIndex;
               option1 = pro.options[index];
                 if(option1.text==json[x].name) {
                     for (i in Json) {
                         if(Json[x].id==i){
                             cit.innerHTML="";
                             for(k in JSon[i]){
                                 cit.innerHTML+=`<option>${JSon[i][k].name}</option>`;

                             }
                         }
                     }
                 }
           }
    }



</script>
</html>
 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>

    window.onload=function () {
        function fn1() {
            var a=1;
            a++;
            ++a;
            function fn2() {
                a=5;
                // return fn3();
                function fn3() {
                    a+=4;
                    return a;
                }
                return fn3;
                // return a;
            }
            return fn2;
        }
        console.log(fn1()()());//返回fn2().
         //fn1().返回return fn2;
        //fn1()().返回return fn3;
        //fn1()()().返回return fn3();
    }
</script>

</body>
</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值