まず、sort.html として HTML ページを作成し、次のコンテンツをそこにコピーします。 コードをコピー コードは次のとおりです。 🎜> .descスパン{表示:なし;} .asc em{表示:なし;} ;/ スクリプト> <br><body> <br><table width="200" border="1" cellpadding="0" sort="true" id= "mytab"> <br><thead style="cursor:pointer"> <br><td class="desc">ID<span>スパン<em>-</em></td><br><td class="desc">名前<スパン>|</span></em> <br><br><td> <br><br> <td>ハッピー</td><br><td>ディナー</td> ></tr><br><td></td><br></tr> /tbody> <br></table> <br><table width="200" border="1" sort="true" id="mytabs"> <br><thead style="cursor : pointer"> <br><tr><br><td class="desc">ID<span>|</span><em>-</em></td> <br><td class="desc">name<span>|</span></em></td> <br></tr> /thead> <br> </td> <tr> <br><td></td> ; 🎜><tr><BR><td>3</td><BR><td>開く<BR></tbody> <br></table> <br><br> <br><br>新しいスクリプト ページ><br><br><br><br>コードをコピー<br><br><br> コードは次のとおりです:<br><div class="codebody" id="code93868"> <br>/* <br>テーブルソート関数<br>イベント: 2012 7 24 <br>DOM ノード<br>テーブルをソートする必要がある場合は、テーブル属性に sort="true" を追加してください <br>ID は唯一かつ必要な ID です<br>この JS ファイルは直接インポートできます<br>作成されたリポジトリにはコメントがないため<br><table width="200" border="1" sort="true " id="mytab" > <br><thead style="cursor:pointer"> <br><tr> <br><td class="desc">ID<span>|< /span><em> ;-</em>gt;</div> </td> <br><td class="desc">name<span>|</span><em>-</em> ;</td> <br></thead> <br><td></td> ><td></td><br><tr><br><tr> ><td></td> <br></td> <br></tbody> <br> / <br>var Core = (function(window){ <br>return { <br>init: function(){ <br>Core.getTableById(); <br>Core.setHeadClick(); <br>}, <br>I: function(id){ <br>return document.getElementById(id); <br>}, <br>N: function(name){ <br>return document.getElementsByTagName(name); }, <br>config: { <br>arr:[] <br>}, <br>getTableById: function(){ <br>var table_arr=Core.N("table"); i = 0; i < table_arr.length; i ){ <BR>if(table_arr[i].getAttribute("sort")){ <BR>Core.arr[i].getAttribute( "id")); <BR>} <BR>} <BR>//alert(Core.config.arr) <BR>}, <BR>setHeadClick: function(){ <BR>var arr = Core.config .arr; <BR>if(!arr.length) return false; <BR>for(var j = 0 ; j<arr.length;j ){ <BR>var thead = Core.I(arr[j]) .getElementsByTagName("thead")[0].getElementsByTagName("td"); <BR>for(var i = 0; i<thead.length;i ){ <BR>if(thead[i].attachEvent){ <BR>thead[i].attachEvent("onclick",Core.sortList) <BR>}else{ <BR>thead[i].addEventListener("click" ,Core.sortList,false) <BR>} <BR>//if(i==0){ <BR>// thead[i].click(); <BR>// } <BR>} <BR>} <BR>}, <BR>sortList: 関数(e){ <BR>varindex=0,arr=[],sort="asc",table=null; <BR>if(e.srcElement){ <BR>index=e.srcElement.cellIndex; >sort=e.srcElement.getAttribute("sort"); <BR>e.srcElement.className== "asc" "desc" : "asc" ; <BR>e.srcElement.setAttribute("sort") 、ソート == "asc" ? : "asc"); <BR>table = Core.getTableId(e.srcElement) <BR>}else{ <BR>index=e.currentTarget.cellIndex; sort=e.currentTarget.getAttribute("sort"); <BR>e.currentTarget.className=sort == "asc" "desc" : "asc"; <BR>e.currentTarget.setAttribute("sort", sort == "asc" ? "desc" : "asc"); <BR>table = Core.getTableId(e.currentTarget) <BR>Core .getList(table,index,arr); Core.updateList(table,sort,arr); <BR>}, <BR>getTableId: function(p){ <BR>for(var i=0,n =p;n=n.parentNode;i ){ <BR>if(i>100) Break; <BR>if(n.nodeName=="TABLE"){ <BR>//alert(n.nodeName/* n.getAttribute("id")*/) <BR>return n; <BR>} <BR>} <BR>}, <BR>getList: function (table,index,arr){ <BR>var table = table.getElementsByTagName("tbody")[0]; 🎜>for(var i = 0; i< table.rows.length; i ){ <BR>var item = table.rows[i]; <BR>for (var j = 0; j< item.cells.length ;j ){ <BR>var jtem = item.cells[index]; <BR>if(jtem.innerHTML){ <BR>//alert(jtem.innerHTML ) <BR>arr[i]=jtem.innerHTML; <BR>} <BR>break; <BR>} <BR>} <BR>}, <BR>updateList: function (table,sort,arr){ <BR>var table = table.getElementsByTagName("tbody") [0]; <BR>for(var i = 0; i<arr.length;i ){ <BR>for(var j = i 1;j<arr.length;j ){ <BR>if(sort= ="asc"){ <BR>if(arr[i] > arr[j]){ <br>var rwos=table.rows[i].cloneNode (true); <br>table.replaceChild(table. rows[j],table.rows[i]); <br>if(j 1==arr.length){ <br>//table.insertBefore(rwos ,null); <br>}else{ <br>table.insertBefore(rwos,table.rows[j]); <br>} <br>var tim= arr[i] ; <br>arr.splice(i,1,arr) [j]); <br>arr.splice(j,1,tim); <br>} <br>}else{ <br>if(arr[i ] < arr[j]){ <br>var rwos=table.rows[i].cloneNode(true); <br>table.replaceChild(table.rows[j],table.rows[i]); <br>if(j 1==arr.length){ <br>//table.insertBefore(rwos,null); <br>table.appendChild(rwos) <br>}else{ <br>table.insertBefore(rwos ,table.rows[j]); <br>var tim= arr[i]; <br>arr.splice(i,1,arr[j]); <br>arr.splice(j, 1,tim); <br>} <br>} <br>} <br>})(ウィンドウ); <br>window.onload=Core.init;</td> </tr> </div>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
