当前位置: 首页 > 图文教程 > 网络编程 > Javascript > javascript 处理HTML元素必须避免使用的一种方法

Javascript
JavaScript中出现乱码的处理心得
JQuery 写的个性导航菜单
Jquery 高亮显示文本中重要的关键字
使用jQuery获取radio/checkbox组的值的代码收集
jquery 弹出登录窗口实现代码
JQuery与iframe交互实现代码
Javascript 键盘keyCode键码值表
javascript 事件加载与预加载
javascript 处理事件绑定的一些兼容写法
javascript 鼠标事件总结
javascript 异步的innerHTML使用分析
javascript 键盘事件总结 推荐
javascript Array对象使用小结
再谈javascript 动态添加样式规则 W3C校检
用Javascript同时提交多个Web表单的方法
javascript 闪烁的圣诞树实现代码
键盘上下键移动选择table表格行的js代码
javascript 计算两个整数的百分比值
js tab效果的实现代码
默认让页面的第一个控件选中的javascript代码

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 199 ::
收藏到网摘: n/a

我们在编写前台页面的时候,可能经常会用到“javascript+数据”生成页面元素的方法,但当我们要处理的数据量较大,导致页面需要展现过多的控件的时候,页面的响应速度也会直线下降 我们可能往往会去排查问题的缘由,其实,在排查掉冗余的循环和精简了控件数量后,我们发现性能还是不乐观,于是继续排查,一个偶然的修改,却大大改善了效率,就是类似如下的修改:
修改前:
复制代码 代码如下:

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的方法,这种方法就是比较简单和便捷,但是在性能方面还是有所损失的,因为这中间必然涉及到一个将字符串转换为正确的页面控件的的一个过程,这其中的性能损失可能比较大,所以造成了页面相应的迟缓。