> 웹 프론트엔드 > JS 튜토리얼 > javascript 테이블 내용 정렬 간단한 작업 샘플 코드_javascript 기술

javascript 테이블 내용 정렬 간단한 작업 샘플 코드_javascript 기술

WBOY
풀어 주다: 2016-05-16 17:05:32
원래의
842명이 탐색했습니다.
코드 복사 코드는 다음과 같습니다.

< /div>
<script> <br>var listInfos = new Array() <br>listInfos[0] = new Array() <br>listInfos[0][0] = {'이름': '추천 페이지 1','DayCount':666,'AvgTime':29872,'ErrCount':180663,'ErrorRate':'2873%','DaySystemErrorCount':0,'DaySystemrErrorRate':'0%'} <br>listInfos[ 0][1] = {'name':'추천 페이지 2','DayCount':593896,'AvgTime':24946,'ErrCount':222,'ErrorRate':'2%','DaySystemErrorCount' :0, 'DaySystemrErrorRate':'0%'} <br>listInfos[0][2] = {'name':'추천 페이지 3','DayCount':956,'AvgTime':27957,'ErrCount': 111,' ErrorRate':'10%','DaySystemErrorCount':0,'DaySystemrErrorRate':'0%'} <br>listInfos[1] = new Array() <br>listInfos[1][0] = {'이름':'추천 페이지 4','DayCount':666,'AvgTime':116,'ErrCount':180663,'ErrorRate':'2873%','DaySystemErrorCount':0,'DaySystemrErrorRate':'0 %'} <br>listInfos[1][1] = {'name':'추천 페이지 5','DayCount':11,'AvgTime':222,'ErrCount':222,'ErrorRate':'2% ',' DaySystemErrorCount':0,'DaySystemrErrorRate':'0%'} <br>listInfos[1][2] = {'name':'추천 페이지 6','DayCount':956,'AvgTime':956 ,'ErrCount':111,'ErrorRate':'10%','DaySystemErrorCount':0,'DaySystemrErrorRate':'0%'} <br>function dateDesc(listInfos,field){ <br>for( var i= 0; i < listInfos.length ; i ){ <BR>for( var j = i 1 ; j < listInfos.length ; j ){ <BR>if( isCommaPercent(listInfos[i][field]) < isCommaPercent(listInfos [j][field]) ){ <BR>var arrayTemp = new Array(); <BR>arrayTemp = listInfos[i] <BR>listInfos[i] = listInfos[j]; [j] = arrayTemp; <BR>} <BR><br>} <br>} <BR>return listInfos; <BR>} <BR>function dataAsc(listInfos,field){ <BR>for( var i= 0; i < listInfos.length ; i ){ <BR>for( var j = i 1 ; j < listInfos.length ; j ){ <BR>if( isCommaPercent(listInfos[i][field]) > isCommaPercent(listInfos [j][field]) ){ <br>var arrayTemp = new Array(); <br>arrayTemp = listInfos[i] <br>listInfos[i] = listInfos[j]; [j] = arrayTemp; <br><br>} <br>} <br>return listInfos; <br>} <br><br>function isCommaPercent(value){ <br>var valueFloat; 🎜>value = value.toLocaleString(); <br>valueFloat = ( value.indexOf(',') > 0 )? value.split(',').join(''):valueFloat; = (valueFloat .indexOf('%') > 0)?parseFloat(valueFloat.substr(0,valueFloat.indexOf('%'))):parseFloat(valueFloat) <br>return valueFloat; 🎜><br><br><br>function sortOperation(sortInfos,field,sort){ <br>var listInfos = new Array() <br>if( sort == 'desc' ){ <br>for( var i= 0; i < sortInfos.length ; i ){ <br>listInfos[i] = dateDesc(sortInfos[i],field) <br>} <br>}else if( sort == 'asc' ){ <br>for(var i=0; i < sortInfos.length ; i ){ <BR>listInfos[i] = dataAsc(sortInfos[i],field) <BR>} <BR>}else{ <BR> Alert('작업 오류...'); <BR>return false <BR>} <BR><BR>var tableStrList ='' <BR>for( var i=0; i < listInfos .length ; i ){ <BR>var tableStr='<h1>program</h1>' <br>tableStr = '<table width="100%"cellspacing="0" cellpadding="0" border =" 1" class="programTabble"><tbody><tr class="indexTableTr">' <br>tableStr ='<td width="16%">프로그램 이름</td> &lt ;td width="14%">당일 방문수(회)</td><td width="14%">평균 응답 시간(us)</td><td width= "14%">오류 횟수(회)</td>' <br>tableStr ='<td width="14%">오류율(%)</td> ="14 %">시스템 오류 수(회)</td> <td width="14%">시스템 오류율(%)</tr> >for( var j = 0 ; j < listInfos[i].length ; j ){ <br>tableStr ='<tr>' <br>tableStr ='<td><a href="detail .php?type =programs&pid=1">' listInfos[i][j]['name'] '</a></td>'; <br>tableStr ='<td>' i][j ]['DayCount'] '</td>' <br>tableStr ='<td>' listInfos[i][j]['AvgTime'] '</td>'; 🎜>tableStr = '<td>' listInfos[i][j]['ErrCount'] '</td>' <br>tableStr ='<td>' ErrorRate'] ' </td>'; <br>tableStr ='<td>' listInfos[i][j]['DaySystemErrorCount'] '<br>tableStr ='< td>' listInfos [i][j]['DaySystemrErrorRate'] '</td>' <br>tableStr ='</tr>' <br>tableStr ='</tbody&gt ;</ table>'; <br>tableStrList = tableStr <br>} <br><br>document.getElementById("html").innerHTML=tableStrList <br>sortOperation(listInfos,'DayCount) ','asc') <br></script>

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿