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 相关文章推荐
看了就知道什么是JSON
Dec 09 Javascript
jquery插件jbox使用iframe关闭问题
Feb 09 Javascript
JS实现金额转换(将输入的阿拉伯数字)转换成中文的实现代码
Sep 30 Javascript
js获取url参数代码实例分享(JS操作URL)
Dec 13 Javascript
Javascript学习笔记之 对象篇(一) : 对象的使用和属性
Jun 24 Javascript
浅谈js的html元素的父节点,子节点
Aug 06 Javascript
jQuery中的select操作详解
Nov 29 Javascript
详解webpack打包后如何调试的方法步骤
Nov 07 Javascript
JS回调函数深入理解
Oct 16 Javascript
node.js中 redis 的安装和基本操作示例
Feb 10 Javascript
详解element上传组件before-remove钩子问题解决
Apr 08 Javascript
JavaScript中isPrototypeOf函数
Nov 07 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
不用数据库的多用户文件自由上传投票系统(3)
2006/10/09 PHP
在PHP3中实现SESSION的功能(一)
2006/10/09 PHP
163的邮件用phpmailer发送(实例详解)
2013/06/24 PHP
CI框架中集成CKEditor编辑器的教程
2014/06/09 PHP
Zend Framework 2.0事件管理器(The EventManager)入门教程
2014/08/11 PHP
PHP设计模式之委托模式定义与用法简单示例
2018/08/13 PHP
thinkPHP5框架实现多数据库连接,跨数据连接查询操作示例
2019/05/29 PHP
PHP实现简单日历类编写
2020/08/28 PHP
JavaScript函数详解
2014/11/17 Javascript
jQuery+ajax实现动态执行脚本的方法
2015/01/27 Javascript
jQuery添加和删除指定标签的方法
2015/12/16 Javascript
Perl Substr()函数及函数的应用
2015/12/16 Javascript
30分钟快速掌握Bootstrap框架
2016/05/24 Javascript
基于jQuery实现弹幕APP
2017/02/10 Javascript
es6在react中的应用代码解析
2017/11/08 Javascript
解决vue中监听input只能输入数字及英文或者其他情况的问题
2018/08/30 Javascript
使用React手写一个对话框或模态框的方法示例
2019/04/25 Javascript
使用Python的Twisted框架编写非阻塞程序的代码示例
2016/05/25 Python
unittest+coverage单元测试代码覆盖操作实例详解
2018/04/04 Python
python之django母板页面的使用
2018/07/03 Python
Window环境下Scrapy开发环境搭建
2018/11/18 Python
对python for 文件指定行读写操作详解
2018/12/29 Python
Python设计模式之解释器模式原理与用法实例分析
2019/01/10 Python
用uWSGI和Nginx部署Flask项目的方法示例
2019/05/05 Python
python,Django实现的淘宝客登录功能示例
2019/06/12 Python
python SocketServer源码深入解读
2019/09/17 Python
如何实现在jupyter notebook中播放视频(不停地展示图片)
2020/04/23 Python
初婚未育未抱养证明
2014/01/12 职场文书
中学生校园广播稿
2014/01/16 职场文书
学习型班组申报材料
2014/05/31 职场文书
森林防火标语
2014/06/23 职场文书
自主招生推荐信格式模板
2015/03/24 职场文书
2015年先进个人自荐书
2015/03/24 职场文书
化妆品促销活动总结
2015/05/07 职场文书
公司处罚决定书
2015/06/24 职场文书
如何解决goland,idea全局搜索快捷键失效问题
2022/04/03 Golang