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 相关文章推荐
IE浏览器PNG图片透明效果代码
Sep 02 Javascript
使用jQuery实现星级评分代码分享
Dec 09 Javascript
jQuery中replaceWith()方法用法实例
Dec 25 Javascript
深入理解JavaScript编程中的原型概念
Jun 25 Javascript
javascript瀑布流布局实现方法详解
Feb 17 Javascript
浅析jquery如何判断滚动条滚到页面底部并执行事件
Apr 29 Javascript
JS封装的选项卡TAB切换效果示例
Sep 20 Javascript
Bootstrap CSS组件之大屏幕展播
Dec 17 Javascript
js学使用setTimeout实现轮循动画
Jul 17 Javascript
讲解vue-router之什么是动态路由
May 28 Javascript
JS实现继承的几种常用方式示例
Jun 22 Javascript
Vue中component标签解决项目组件化操作
Sep 04 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
php下保存远程图片到本地的办法
2010/08/08 PHP
PHP数据流应用的一个简单实例
2012/09/14 PHP
PHP获取文件夹内文件数的方法
2015/03/12 PHP
PHP开发api接口安全验证操作实例详解
2020/03/26 PHP
Firebug 字幕文件JSON地址获取代码
2009/10/28 Javascript
JavaScript写的一个自定义弹出式对话框代码
2010/01/17 Javascript
跟着JQuery API学Jquery 之二 属性
2010/04/09 Javascript
js 文件引入实现代码
2010/04/23 Javascript
jQuery ajax BUG:object doesn't support this property or method
2010/07/06 Javascript
jQuery Jcrop插件实现图片选取功能
2011/11/23 Javascript
jQuery实现简单的日期输入格式化控件
2015/03/12 Javascript
jQuery中$.extend()用法实例
2015/06/24 Javascript
jQuery过滤HTML标签并高亮显示关键字的方法
2015/08/07 Javascript
如何防止JavaScript自动插入分号
2015/11/05 Javascript
原生js实现新闻列表展开/收起全文功能
2017/01/20 Javascript
js/jq仿window文件夹移动/剪切/复制等操作代码
2017/03/08 Javascript
微信小程序实现星级评分和展示
2018/07/05 Javascript
layui框架与SSM前后台交互的方法
2019/09/12 Javascript
[49:29]LGD vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
Python内置函数Type()函数一个有趣的用法
2015/02/18 Python
python数据类型判断type与isinstance的区别实例解析
2017/10/31 Python
pycharm配置pyqt5-tools开发环境的方法步骤
2019/02/11 Python
如何使用python3获取当前路径及os.path.dirname的使用
2019/12/13 Python
Python 3.8 新功能大揭秘【新手必学】
2020/02/05 Python
Python调用Redis的示例代码
2020/11/24 Python
英国领先的高级美容和在线皮肤诊所:Face the Future
2020/06/17 全球购物
现实表现材料范文
2014/12/23 职场文书
幼儿园大班开学寄语(2016秋季)
2015/12/03 职场文书
Mysql 性能监控及调优
2021/04/06 MySQL
go 实现简易端口扫描的示例
2021/05/22 Golang
详解如何用Python实现感知器算法
2021/06/18 Python
厉害!这是Redis可视化工具最全的横向评测
2021/07/15 Redis
Linux7.6二进制安装Mysql8.0.27详细操作步骤
2021/11/27 MySQL
关于ObjectUtils.isEmpty() 和 null 的区别
2022/02/28 Java/Android
详解Python中__new__方法的作用
2022/03/31 Python
笔记本自带的win11如何跳过联网激活?
2022/04/20 数码科技