国产在线一区二区三区在线,2020最新久久久视精品爱,一级特黄大片色欧美精品

　JS表格排序新法

作者：myhyli　時(shí)間： 2003-09-30　文檔類型：原創(chuàng)　來自：藍(lán)色理想

不知大家對(duì)精華區(qū)的表格排序終極優(yōu)化是否還有記憶，當(dāng)時(shí)討論的結(jié)果曾以為是最快的JS排序了，實(shí)則不然，按前段時(shí)間我發(fā)的DHTML性能提升帖（轉(zhuǎn)譯）所講到的，DOM效率某些情況下并不如DHTML，比如一次寫入大量數(shù)據(jù)時(shí)，DOM頻繁創(chuàng)建添加反而更慢，所以可以對(duì)排序算法作以下修改：

<table id=downloadList border="1" width="100%" onclick="sortTable()"> <tr> <td>AddCommonInfo.mxp</td> <td>MXP File</td> <td>2614</td> <td>2002-12-30 16:45:22,Fri</td> </tr> <tr> <td>addtemplateparam.mxp</td> <td>MXP File</td> <td>3100</td> <td>2002-12-5 13:28:24,Sun</td> </tr> </table> <script> var curObj; function sortTable() { var start=new Date() var i; var theRows=new Array(); for(i=0;i<downloadList.rows.length;i++) { theRows[i]=new Array(downloadList.rows[i].cells[0].innerText.toLowerCase(),downloadList.rows[i].outerHTML); } theRows.sort(sortRows); var str='' for(i=0;i<theRows.length;i++) { str+=theRows[i][1]; } downloadList.outerHTML='<table id=downloadList border="1" width="100%">'+str+'</table>' curObj=null; alert(new Date()-start) return ; } function sortRows(x,y) { if(x[0]>y[0]) return -1; else if(x[0]<y[0]) return 1; else return 0; } </script>

[單擊全選，Ctrl+A復(fù)制，將代碼保存成html文件運(yùn)行]

注意測(cè)試時(shí)將記錄條數(shù)增加到500條以上，推薦1000條
我測(cè)試結(jié)果是平均1322ms左右

但這樣就是最快的嗎？非也，且看以下xml+xslt+js例子，能把時(shí)間縮短到721ms左右
需要準(zhǔn)備三個(gè)文件
1. xml文件 ---節(jié)省版面起見，這里只羅列兩條記錄
<?xml version="1.0" encoding="UTF-8" ?>
<root>
<record>
    <info>AddCommonInfo.mxp</info>
    <info>MXP File</info>
    <info>2614</info>
<info>2002-12-30 16:45:22,Fri</info>
</record>
<record>
    <info>addtemplateparam.mxp</info>
    <info>MXP File</info>
    <info>3100</info>
    <info>2002-12-5 13:28:24,Sun</info>
</record>
</root>

2. xsl 文件
<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl" version="1.0">
<xsl:template match="root">
<table border="1" width="100%">
<xsl:for-each select="record">
<tr>
<xsl:for-each select="info">
<td>
<xsl:value-of select="text()" />
</td>
</xsl:for-each>
</tr>
</xsl:for-each>
</table>
</xsl:template>
</xsl:stylesheet>

注意命名空間，想要在IE5下兼容，必須使用這個(gè)名字

3.htm文件
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <script> function safeLoadXML(xmlObj,url,func) { xmlObj.async = true; xmlObj.resolveExternals = false; xmlObj.onreadystatechange = function() { if(xmlObj.readyState==4 && xmlObj.parseError==0) { func(xmlObj); } } xmlObj.load(url); } function transformXML(xmlObj,xslObj) { var returnValue = xmlObj.transformNode(xslObj); return returnValue; } var xmlDoc = new ActiveXObject("Msxml.DOMDocument"); var xslDoc = new ActiveXObject("Msxml.DOMDocument"); function init() { safeLoadXML(xmlDoc,'sort.xml', function() { safeLoadXML(xslDoc,'sort.xsl', function() { test.innerHTML = transformXML(xmlDoc.documentElement,xslDoc.documentElement); }); }); } function sortIt() {var start=new Date(); var temp = []; for(var i=0;i<xmlDoc.documentElement.childNodes.length;i++) { temp[temp.length] = [xmlDoc.documentElement.childNodes[i].firstChild.firstChild.nodeValue,xmlDoc.documentElement.childNodes[i]] } temp.sort(sortFunc); for(var i=0;i<temp.length;i++) { xmlDoc.documentElement.insertBefore(temp[i][1],xmlDoc.documentElement.firstChild) } test.innerHTML = transformXML(xmlDoc.documentElement,xslDoc.documentElement); alert(new Date()-start); } function sortFunc(x,y) { if(x[0].toLowerCase()>y[0].toLowerCase()) return 1; else if(x[0].toLowerCase()<y[0].toLowerCase()) return -1; else return 0; } window.onload=init; </script> </HEAD> <BODY> <div id=test onclick=sortIt()></div> </BODY> </HTML>

[單擊全選，Ctrl+A復(fù)制，將代碼保存成html文件運(yùn)行]

以上代碼在 WIN2K，IE5 下測(cè)試通過，歡迎大家指正 :)

出處：藍(lán)色理想
責(zé)任編輯：紅色黑客

◎進(jìn)入論壇網(wǎng)頁制作、網(wǎng)站綜合版塊參加討論

相關(guān)文章

好玩的樣式—放大效果

作者文章

提高你的DHTML性能

一個(gè)格式化數(shù)值的函數(shù)

習(xí)作:組件HTML UI Components


關(guān)鍵字搜索	常規(guī)搜索	推薦文檔
熱門搜索：CSS Fireworks 設(shè)計(jì)比賽網(wǎng)頁制作 web標(biāo)準(zhǔn) 用戶體驗(yàn) UE photoshop Dreamweaver Studio8 Flash 手繪 CG

站點(diǎn)最新

站點(diǎn)最新列表

周大福“敬•自然”設(shè)計(jì)大賽開啟

國(guó)際體驗(yàn)設(shè)計(jì)大會(huì)7月將在京舉行

中國(guó)國(guó)防科技信息中心標(biāo)志征集

云計(jì)算如何讓安全問題可控

云計(jì)算是多數(shù)企業(yè)唯一擁抱互聯(lián)網(wǎng)的機(jī)會(huì)

阿里行云

云手機(jī)年終巨獻(xiàn)，送禮標(biāo)配299起

阿里巴巴CTO王堅(jiān)的"云和互聯(lián)網(wǎng)觀"

1499元買真八核云OS雙蛋大促

首屆COCO桌面手機(jī)主題設(shè)計(jì)大賽

欄目最新

欄目最新列表

淺談JavaScript編程語言的編碼規(guī)范

如何在illustrator中繪制臺(tái)歷

Ps簡(jiǎn)單繪制一個(gè)可愛的鉛筆圖標(biāo)

數(shù)據(jù)同步算法研究

用ps作簡(jiǎn)單的作品展示頁面

CSS定位機(jī)制之一:普通流

25個(gè)最佳最閃亮的Eclipse開發(fā)項(xiàng)目

Illustrator中制作針線縫制文字效果

Photoshop制作印刷凹凸字體

VS2010中創(chuàng)建自定義SQL Rule

中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx