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 autocomplete 使用手册
Apr 01 Javascript
IE下Ajax缓存问题的快速解决方法(get方式)
Jan 09 Javascript
JS小游戏之仙剑翻牌源码详解
Sep 25 Javascript
node.js抓取并分析网页内容有无特殊内容的js文件
Nov 17 Javascript
基于RequireJS和JQuery的模块化编程日常问题解析
Apr 14 Javascript
Vue父子模版传值及组件传值的三种方法
Nov 27 Javascript
JS实现的文字间歇循环滚动效果完整示例
Feb 13 Javascript
基于vue-cli vue-router搭建底部导航栏移动前端项目
Feb 28 Javascript
如何优雅地在vue中添加权限控制示例详解
Mar 07 Javascript
详解React项目中碰到的IE问题
Mar 14 Javascript
Antd的Table组件嵌套Table以及选择框联动操作
Oct 24 Javascript
vue-cli3.x配置全局的scss的时候报错问题及解决
Apr 30 Vue.js
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如何实现不借助IDE快速定位行数或者方法定义的文件和位置
2017/01/17 PHP
PHP从零开始打造自己的MVC框架之入口文件实现方法详解
2019/06/03 PHP
用js生产批量批处理执行命令
2008/07/28 Javascript
javascript一个无懈可击的实例化XMLHttpRequest的方法
2010/10/13 Javascript
更快的异步执行(setTimeout多浏览器)
2014/08/12 Javascript
JavaScript实现网页加载进度条代码超简单
2015/09/21 Javascript
简单实现JS对dom操作封装
2015/12/02 Javascript
详解基于angular路由的requireJs按需加载js
2017/01/20 Javascript
js调用刷新界面的几种方式
2017/05/03 Javascript
微信小程序联网请求的轮播图
2017/07/07 Javascript
Vue2.0用户权限控制解决方案
2017/11/29 Javascript
Node.JS段点续传:Nginx配置文件分段下载功能的实现方法
2018/03/12 Javascript
async/await地狱该如何避免详解
2018/05/10 Javascript
浅析JS中什么是自定义react数据验证组件
2018/10/19 Javascript
微信小程序用户授权,以及判断登录是否过期的方法
2019/05/10 Javascript
使用p5.js临摹动态图形
2019/10/23 Javascript
解决Vue中的生命周期beforeDestory不触发的问题
2020/07/21 Javascript
python计算最大优先级队列实例
2013/12/18 Python
Python迭代器与生成器用法实例分析
2018/07/09 Python
利用Python正则表达式过滤敏感词的方法
2019/01/21 Python
OpenCV-Python 摄像头实时检测人脸代码实例
2019/04/30 Python
python读取并写入mat文件的方法
2019/07/12 Python
python Event事件、进程池与线程池、协程解析
2019/10/25 Python
如何使用Python发送HTML格式的邮件
2020/02/11 Python
Python @property原理解析和用法实例
2020/02/11 Python
Windows下Anaconda和PyCharm的安装与使用详解
2020/04/23 Python
Django Form设置文本框为readonly操作
2020/07/03 Python
HTML5的一个显示电池状态的API简介
2015/06/18 HTML / CSS
吉列剃须刀英国官网:Gillette英国
2019/03/28 全球购物
地球鞋加拿大官网:Earth Shoes Canada
2020/11/17 全球购物
机电专业大学生职业规划书范文
2014/02/25 职场文书
导师对论文的学术评语
2015/01/04 职场文书
审查起诉阶段律师意见书
2015/05/19 职场文书
活动新闻稿范文
2015/07/17 职场文书
python绘制简单直方图(质量分布图)的方法
2022/04/21 Python
muduo TcpServer模块源码分析
2022/04/26 Redis