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学习笔记[1] jQuery中的DOM操作
Dec 03 Javascript
实例详解jQuery Mockjax 插件模拟 Ajax 请求
Jan 12 Javascript
js实现的简单图片浮动效果完整实例
May 10 Javascript
yarn与npm的命令行小结
Oct 20 Javascript
JS比较两个数值的大小实例
Nov 25 Javascript
jQuery Checkbox 全选 反选的简单实例
Nov 29 Javascript
浅谈Koa服务限流方法实践
Oct 23 Javascript
Vue shopCart 组件开发详解
Jan 26 Javascript
在Node.js中将SVG图像转换为PNG,JPEG,TIFF,WEBP和HEIF格式的方法
Aug 22 Javascript
layui实现form表单同时提交数据和文件的代码
Oct 25 Javascript
浅析vue-router中params和query的区别
Dec 24 Javascript
如何在JS文件中获取Vue组件
Sep 16 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实现的九九乘法口诀表简洁版
2014/07/28 PHP
PHP微信模板消息操作示例
2017/06/29 PHP
PHP 数组黑名单/白名单实例代码详解
2019/06/04 PHP
网页自动刷新,不产生嗒嗒声的一个解决方法
2007/03/27 Javascript
改善你的jQuery的25个步骤 千倍级效率提升
2010/02/11 Javascript
仿新浪微博登陆邮箱提示效果的js代码
2013/08/02 Javascript
jQuery实现移动 和 渐变特效的点击事件
2015/02/26 Javascript
jquery中trigger()无法触发hover事件的解决方法
2015/05/07 Javascript
玩转NODE.JS(四)-搭建简单的聊天室的代码
2016/11/11 Javascript
bootstrap paginator分页前后台用法示例
2017/06/17 Javascript
jquery实现限制textarea输入字数的方法
2017/09/06 jQuery
使用JavaScript破解web
2018/09/28 Javascript
js实现图片粘贴到网页
2019/12/06 Javascript
Vue.js仿Select下拉框效果
2020/02/18 Javascript
python多线程抓取天涯帖子内容示例
2014/04/03 Python
深入理解Python中的 __new__ 和 __init__及区别介绍
2018/09/17 Python
在Python中获取两数相除的商和余数方法
2018/11/10 Python
Linux下Pycharm、Anaconda环境配置及使用踩坑
2018/12/19 Python
Python logging模块写入中文出现乱码
2020/05/21 Python
Kmeans均值聚类算法原理以及Python如何实现
2020/09/26 Python
python import 上级目录的导入
2020/11/03 Python
python 数据类型强制转换的总结
2021/01/25 Python
详解CSS3的opacity属性设置透明效果的用法
2016/05/09 HTML / CSS
HTML5 文件上传下载的实例代码
2017/07/03 HTML / CSS
纽约香氛品牌:NEST Fragrance
2018/10/15 全球购物
极度干燥澳大利亚官方网站:Superdry澳大利亚
2019/03/28 全球购物
高级Java程序员面试要点
2013/08/02 面试题
总经理司机岗位职责
2014/02/06 职场文书
快餐公司创业计划书
2014/04/29 职场文书
股东出资证明书(正规版)
2014/09/24 职场文书
餐厅感恩节活动策划方案
2014/10/11 职场文书
全国法制宣传日活动总结2014
2014/11/01 职场文书
高中运动会广播稿
2015/08/19 职场文书
2016年百日安全生产活动总结
2016/04/06 职场文书
教你如何使用Python Tkinter库制作记事本
2021/06/10 Python
Java Dubbo框架知识点梳理
2021/06/26 Java/Android