前端工作中的不断总结，以及帮人解答和被人解答

Karsuo
205 阅读1分钟
  1. 这个是当时学js时碰到的问题，闭包 i 索引的问题
    <ul>
        <li class="a">1</li>
        <li class="a">2</li>
        <li class="a">3</li>
        <li class="a">4</li>
    </ul>

    <script>
        var aLi = document.querySelectorAll(".a");
        [].forEach.call(aLi,function (val,key){
            val.onclick = function (){
                alert(key);
            }
        });

        for(var i=0; i<aLi.length; i++){
                aLi[i].index = i;
                aLi[i].onclick = function (){
                    alert(this.index);
                }
        }

        for(var i=0; i<aLi.length; i++){
            (function (i){
                aLi[i].onclick = function (){
                    alert(i);
                }
            })(i)
        }

        大家都知道forEach是循环数组用的，而且很方便，可以丢掉for循环了，但是它不能循环Dom元素。
        其实我们可以利用call来完成forEach循环Dom
    </script>
  1. 在公司的开发环境中 swagger文档 有时自己要配数据做测试，一般都是json格式
    json格式 不能打 单引号 ！！！切记 'MT' , 不然会报错，我现在的就会报错，不知道你们会不会
    {
        "status": false,
        "message": "Unexpected token ' in JSON at position 563"
    }
    
    换成 "MT",在swagger文档上就能成功 Execute 了
    {
        "status": true,
        "data": [… …… …]
    }
  1. 取得相同父级下的某个元素的索引 index()
<div class="fa">
    <p>-------</p>
    <div class="d1">1111</div>
    <div class="d2">2222</div>
    <div class="d3">3333</div>
</div>

1. 正常情况下 d1.index() 等于 1
2. 当 p.style.display = "none" 时，d1.index() 还是等于 1 ，并不是等于 0 !!，做项目时遇到的坑
3. 当 fa.removeChild(p) , 把<p>元素移除时， d1.index() 就等于 0
  1. 在做上传图片需求，有时点击input type="file" 时，在桌面的弹出框中，或许你要按着 Ctrl 键同时上传几张图片，也或者只要一次传一张
    <input type="file" name="file" accept="image/*">
    这样你只能一次传一张，不能同时选择多张，其实这样比较好，或许我比较菜……
    
    <input type="file"  name="file" accept="image/* multiple="multiple"/>
    multiple属性有加 ，这样就能 ctrl 同时选择多张
  1. 拿到url?xx=xxx&x=xxx 的参数params
    console.log(window.location.search);
    // "?name=karsuo&age=18"
    
    var urlParams = new URLSearchParams(window.location.search);
    console.log(urlParams.has('age')); // true
    console.log(urlParams.get('name')); // "karsuo"
    console.log(urlParams.getAll('name')); // ["karsuo"]
    console.log(urlParams.toString()); // "?name=karsuo&age=18"
    console.log(urlParams.append('active', '1')); // "?name=karsuo&age=18&active=1"
    
    var keys = urlParams.keys();
    for(key of keys) { 
      console.log(key); 
    }
    // name
    // age

    var entries = urlParams.entries();
    for(pair of entries) { 
      console.log(pair[0], pair[1]); 
    }

结语

前端react QQ群：788023830 ---- React/Redux - 地下老英雄

前端交流 QQ群：249620372 ---- FRONT-END-JS前端

（我们的宗旨是，为了加班，为了秃顶……，仰望大佬），希望小伙伴们加群一起学习

avatar
文章
阅读
粉丝