javascript 处理HTML元素必须避免使用的一种方法


Posted in Javascript onJuly 30, 2009

我们可能往往会去排查问题的缘由,其实,在排查掉冗余的循环和精简了控件数量后,我们发现性能还是不乐观,于是继续排查,一个偶然的修改,却大大改善了效率,就是类似如下的修改:
修改前:

objDiv.innerHTML += ‘<img id=”picture” src=”back.gif”>';

修改后:
var imga = document.createElement("img"); 
imga.setAttribute("src","back.gif"); 
imga.setAttribute("id","picture"); 
objDiv.appendChild(imga);

之前可能因为书写的便利,所以没有采用创建页面元素,再分别赋值,最后进行嵌套的方法,而是直接通过字符串赋值innerHTML的方法,这种方法就是比较简单和便捷,但是在性能方面还是有所损失的,因为这中间必然涉及到一个将字符串转换为正确的页面控件的的一个过程,这其中的性能损失可能比较大,所以造成了页面相应的迟缓。
Javascript 相关文章推荐
jQuery创建插件的代码分析
Apr 14 Javascript
页面只能打开一次Cooike如何实现
Dec 04 Javascript
javascript跑马灯悬停放大效果实现代码
Dec 12 Javascript
Javascript+CSS实现影像卷帘效果思路及代码
Oct 20 Javascript
JavaScript输出当前时间Unix时间戳的方法
Apr 06 Javascript
javascript实现连续赋值
Aug 10 Javascript
Angular获取手机验证码实现移动端登录注册功能
May 17 Javascript
vue.js提交按钮时进行简单的if判断表达式详解
Aug 08 Javascript
小程序如何在不同设备上自适应生成海报的实现方法
Aug 20 Javascript
jquery ajax 请求小技巧实例分析
Nov 11 jQuery
JS实现排行榜文字向上滚动轮播效果
Nov 26 Javascript
原生js生成图片验证码
Oct 11 Javascript
javascript 写的一个简单的timer
Jul 30 #Javascript
jquery imgareaselect 使用利用js与程序结合实现图片剪切
Jul 30 #Javascript
Javascript this指针
Jul 30 #Javascript
javascript 进度条 实现代码
Jul 30 #Javascript
JS input 数字验证代码
Jul 30 #Javascript
关于取不到由location.href提交而来的上级页面地址的解决办法
Jul 30 #Javascript
window.parent调用父框架时 ie跟火狐不兼容问题
Jul 30 #Javascript
You might like
示例详解Laravel重置密码代码重构
2016/08/10 PHP
在php的yii2框架中整合hbase库的方法
2018/09/20 PHP
农历与西历对照
2006/09/06 Javascript
javaScript对象和属性的创建方法
2007/01/15 Javascript
传递参数的标准方法(jQuery.ajax)
2008/11/19 Javascript
JavaScript 克隆数组最简单的方法
2009/02/12 Javascript
jquery 实现窗口的最大化不论什么情况
2013/09/03 Javascript
AngularJS初始化静态模板详解
2016/01/14 Javascript
node+experss实现爬取电影天堂爬虫
2016/11/20 Javascript
jQuery实现限制文本框的输入长度
2017/01/11 Javascript
vue2组件实现懒加载浅析
2017/03/29 Javascript
使用clipboard.js实现复制功能的示例代码
2017/10/16 Javascript
浅析vue 函数配置项watch及函数 $watch 源码分享
2018/11/22 Javascript
iview tabs 顶部导航栏和模块切换栏的示例代码
2019/03/04 Javascript
实例分析Array.from(arr)与[...arr]到底有何不同
2019/04/09 Javascript
Python 拷贝对象(深拷贝deepcopy与浅拷贝copy)
2008/09/06 Python
python del()函数用法
2013/03/24 Python
Python中使用第三方库xlutils来追加写入Excel文件示例
2015/04/05 Python
简单介绍利用TK在Python下进行GUI编程的教程
2015/04/13 Python
Python中运算符&quot;==&quot;和&quot;is&quot;的详解
2016/10/08 Python
Python-OpenCV基本操作方法详解
2018/04/02 Python
深入浅析python3中的unicode和bytes问题
2019/07/03 Python
Django 自定义权限管理系统详解(通过中间件认证)
2020/03/11 Python
详解pandas.DataFrame.plot() 画图函数
2020/06/14 Python
Python包和模块的分发详细介绍
2020/06/19 Python
python中复数的共轭复数知识点总结
2020/12/06 Python
浅谈盘点5种基于Python生成的个性化语音方法
2021/02/05 Python
2019年Java面试必问之经典试题
2012/09/12 面试题
销售经理工作职责
2014/02/03 职场文书
保险内勤岗位职责
2014/04/05 职场文书
安全宣传标语
2014/06/10 职场文书
执法作风整顿剖析材料
2014/10/11 职场文书
委托书格式要求
2015/01/28 职场文书
公司放假通知范文
2015/04/14 职场文书
干货:如何写好工作计划!
2019/05/17 职场文书
浅谈spring boot使用thymeleaf版本的问题
2021/08/04 Java/Android