javascript效率经验谈(一)
本文主要是出于有朋友使用我原来写的autocomplete的JS控件。当数据量大的时候,会出现效率极其慢的情况,我在这段时间做出的一些测试也及一些经验,与大家分享,如果有错的地方,还请指出。
经过测试,我们会发现如下的情况或者说的结论,如果您的测试结果与我的不符,请说明原因,以便相互学习。
1)当一个较大的HTML字符串给到obj.innerHTML时会出现麻烦。也就是说当一个较大的字符串在赋予一个Element的innerHTML时,这个过程将可能是我们无法容忍的。(而事实上这并非JS的错,而确实是String数据量太多)
2)用拼合字符串的方法可以使效率提高,在字符串较大时,2)的情况仍然出现。超过一定的数量,速度会明显慢下来。
3)正则匹配的方法会比平常遍历的方法要高效一些。
4)在执行过程中,绑定事件的时间会花费更多一些。测试在1w条数据情况下,大约是匹配以及生成HTML数据的30倍,也就是说生成数据总花费100ms,而绑定事件则需要3000ms。
5)总体来说。IE的速度要比Mozilla要慢(我用的是Firefox1.5做的测试)。
6)大数据量时,不要用DOM生成Element。
7)非JS内置方法,也许会引发很多时间过多重复的劳动而且可能事得其反。建议尽可能利会内置方法。
总结问题:
一、在把字符串给到innerHTML上。
二、循环绑定事件所花费时间。
三、生成我们需要的DIV所花时间。
四、不同的浏览器问题。
下面对症下药:
问题一
我们可以做的没有其它的,只有尽可能少的HTML字符串,比如最基本的一个DIV,可以这样写
<div style="height:20px; font:9pt Verdana;"></div>也可以这样写<div class="c1"></div>,第二种就比第一种速度明显要快的。如果还不行的话,请看下面这个方法对你是否合适
在做程序的时候突然想起来51js上PK tree,一位版主所写的一棵树,1百万的一个节点,动态载入。只需要不到1秒。毫无疑问,肯定是取巧了,因为只要只生tree的html就是一个很大的数量。这个树的特别的地方就是生成树时,并非把1百万的节点都一次生成innerHTML,而是只生成在视角范围内的节点,当滚动条向下滚的时候,才动态的再生成树节点。这个方法至少我觉得思想很开阔,很有价值。
我们所知道,mySQL数据库里取数据可以这么取。SELECT * from table limit 0,100,意思是只取数据库中的0-100条数据。说到这里可能有些朋友也想到了,在JS中,我们可以利用这个方法来取数据,将一个数组看作是一个表。只是单纯的数据表,非二维
相关文档:
<html>
<head>
<script language="javascript">
function overlay() {
xyz = document.getElementById("overlay");
&n ......
1.在COM组件中调用JavaScript函数
// 连接点方式页面javascript脚本
<object classid="CLSID:B568F111-DFE4-4944-B67F-0728AB2AB30F"
id="testCom" VIEWASTEXT></object>
<script language="JavaScript" for="testCom" event="staTe(s)">
&nbs ......
当需要在网页中显示时间时可以用到下面这段代码:
<SCRIPT language=JavaScript type=text/JavaScript>
var day="";
var month="";
var ampm="";
var ampmhour="";
var myweekday="";
var year="";
mydate=new Date();
myweekday=mydate.getDay();
mymonth=mydate.getMonth()+1;
myday= mydate.getDate(); ......
1、字符串转换为数值
常规方法:
JScript code
var a = parseFloat("12");
var b = parseInt("34");
可以用
JScript code
var a = +("12");
var b = +("34");
2、多维数组
常规方法:
JScript code
var A = new Array(2);
A[0] = new Array(2);
A[1] = new Array(2);
A[0][0] = 1;
A[0][1] = 2;
A[1][0] = ......
javascript集锦
javascript数组操作汇总
javascript动态创建form表单 和 节点控制说明
动态读取
javascript:function ctys(_ctag){
ctys1=document.createElement(_ctag);
document.body.appendChild(ctys1);
return ctys1
};
newE1=ctys('<TEXTAREA id=www>');
newE1.cols='150';
newE1.rows='30 ......