正在加载中

最后更新于 2018年09月05日

由于每次使用innerHTML都会创建一个浏览器级别的解析器,但是要是使用innerHTML的量大的话,往往会浪费很多资源,特别是在重复传入数据的时候,所以我们可以先使用一个变量来保存这些数据,最后一口气直接传入,这样只使用了一个解析器,省资源又省心。

html部分:

\<ul id="box"> </ul>\  //博客直接写ul会空白,被解析到了,所以我在前后加了斜杠,这个斜杠不要管它

 

这是一个空的ul元素,我们给他传入十个li元素;一般写法:

var box = document.getElementById('box'); 
for(var i = 0;i<10;i++) {
    box.interHTML ='<li>1</li>';
};

这样写,你以为会传入十个li,实际上只有一个,因为每次传入的值又会被下一次重复的传入的时候替换掉,所以,最好的方法就是使用数组保存数据,然后一次性传入,写法如下:

var box = document.getElementById('box'); 
var ger = [];
for(var i = 0;i<10;i++) {
   ger.push('<li>t</li>');
};
box.innerHTML = ger.join('')

创建一个数组ger,然后重复的时候每次都在后面传入数据,最后通过join('')将数组转换为字符,括号里不填内容,这样数组就不会被填入的字符隔开,innerHTML解析的时候就不会出现问题,然后一次性innerHTML解析,完美。

如果你join('-');加了字符,解析的时候,每个li元素的后面都会带一个[-],这就不是我们想要的结果了。

  • weixiao kaixin tushetou jingkong deyi fanu liezui liuhan daku ganga bishi nanguo lihai qian yiwen numu tu yi haixiu se fadai minyan hehe henkaixin huaji biyiyan kuanghan maimeng shui xiaku penqi zhangzui pen aini ye niu laji ok chigua renshi kongbu shuai xiaoxiese touxiao huaixiao jingnu chihuai kaisang xiaoku koubi zhuangbi lianhong kanbujian shafa zhijing xiangjiao dabian yaowan redjing lazhu rizhi duocang chixigua hejiu xixi xiaopen goukun xiaobuchu shenme wusuowei guancha lajing chouyan xiaochi bie zhadanzui zhadanxiao
  1. 过滤沙缸

    发表于:
    来自 Google Chrome 67 in windows 7

    阅,谢谢楼主

    1. 木灵鱼儿

      发表于:
      来自 FireFox 61 in windows 10
      @过滤沙缸

      希望对你有帮助吧!

登录