Xml_javascript 페이지 매김
Xml_javascript paging
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>龙的传人--Xml_javascript分页</title>
</head>
<body onload="getxmlDoc()">
<script language="Javascript" type="text/javascript">
var xmlDoc;
var nodeIndex;
var pageIndex;
var pageSize=13;
var lastPage; //最后一页
var overSize //最后一页的记录数
function getxmlDoc()
{
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
var currNode;
xmlDoc.async=false;
xmlDoc.load("myTest.xml");
if(xmlDoc.parseError.errorCode!=0)
{
var myErr=xmlDoc.parseError;
alert("出错！"+myErr.reason);
}
getRecordCount();
onFirst();
}
function getRecordCount()
{
var personNode= xmlDoc.selectNodes("/Root")[0];
var recordCount=personNode.childNodes.length;
var pageCount=Math.ceil(recordCount/pageSize);
document.getElementById("txtPageCount").value=pageCount;
document.getElementById("txtRecordCount").value=recordCount;
overSize=recordCount%pageSize;
if(overSize>0)
{
lastPage=recordCount-overSize;
}
else
{
lastPage=recordCount-pageSize;
}
}
function getPageRecord(pageIndex,pageSize)
{
clearRow("myTable");
var personNode= xmlDoc.selectNodes("/Root")[0];
var currNode=personNode.childNodes[pageIndex];
for(var i=pageIndex;i<pageIndex+pageSize;i++)
{
var arr=new Array();
var nNode= xmlDoc.selectSingleNode("Root/Person["+i+"]") ;
arr[0]=nNode.getAttribute("Id"); //序号
arr[1]=nNode.childNodes[0].text; //工号
arr[2]=nNode.childNodes[1].text; //姓名
arr[3]=nNode.childNodes[2].text; //性别
arr[4]=nNode.childNodes[3].text; //部门
arr[5]=nNode.childNodes[4].text; //职位
arr[6]=nNode.childNodes[5].text; //地址
// arr[0]=personNode.childNodes[i].getAttribute("Id"); //序号
// arr[1]=personNode.childNodes[i].childNodes[0].text; //工号
// arr[2]=personNode.childNodes[i].childNodes[1].text; //姓名
// arr[3]=personNode.childNodes[i].childNodes[2].text; //性别
// arr[4]=personNode.childNodes[i].childNodes[3].text; //部门
// arr[5]=personNode.childNodes[i].childNodes[4].text; //职位
// arr[6]=personNode.childNodes[i].childNodes[5].text; //地址
addRow(i+1,"myTable",arr);
}
}
function onFirst()
{
pageIndex=0;
var currIndex=pageIndex;
getPageRecord(currIndex,pageSize)
pageIndex=currIndex ;
document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
document.getElementById("txtCurrPageRecord").value=pageSize;
}
function onPRev()
{
var currIndex=pageIndex;
currIndex-=pageSize;
getPageRecord(currIndex,pageSize)
pageIndex=currIndex;
document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
document.getElementById("txtCurrPageRecord").value=pageSize;
}
function onNext()
{
var currIndex=pageIndex;
currIndex+=pageSize;
getPageRecord(currIndex,pageSize)
pageIndex=currIndex;
document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
document.getElementById("txtCurrPageRecord").value=pageSize;
}
function onLast()
{
if(overSize>0)
{
getPageRecord(lastPage,overSize)
document.getElementById("txtCurrPageRecord").value=overSize;
}
else
{
getPageRecord(lastPage,pageSize)
document.getElementById("txtCurrPageRecord").value=pageSize;
}
pageIndex=lastPage;
document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;
}
function toPage()
{
var index=document.getElementById("txtCurrPage").value
var currIndex=(index-1)*pageSize;
if(event.keyCode==13)
{
getPageRecord(currIndex,pageSize);
}
pageIndex=currIndex;
}
function addRow(i,dataGridId,arr)
{
var row=document.createElement("tr");
var cell=createCellWidthText(i);
row.appendChild(cell);
for(var j=0;j<arr.length;j++)
{
cell=createCellWidthText(arr[j]);
row.appendChild(cell);
}
document.getElementById(dataGridId).firstChild.appendChild(row);
}
function createCellWidthText(text)
{
var cell = document.createElement("td");
var textNode = document.createTextNode(text);
cell.appendChild(textNode);
return cell;
}
function clearRow(obj)
{
var table=document.getElementById(obj);
var nodeTbody=table.firstChild
var length=nodeTbody.childNodes.length;
for(var i=length-1;i>0;i--)
{
nodeTbody.removeChild(nodeTbody.childNodes[i]);
}
}
</script>
<form id="form1" runat="server">
<div>
<table align="center" style="border-right: #0033ff thin solid; border-top: #0033ff thin solid;
border-left: #0033ff thin solid; width: 650px; border-bottom: #0033ff thin solid">
<tr>
<td>
共<input id="txtPageCount" name="txtPageCount" style="width: 33px;
color: #0000ff; border-top-style: none; border-right-style: none;
border-left-style: none; background-color: transparent; border-bottom-style: none;" type="text" onkeydown="toPage()"/>页/
<input id="txtRecordCount" name="txtRecordCount" style="width: 46px;
color: #3300ff; border-top-style: none; border-right-style: none;
border-left-style: none; background-color: transparent; border-bottom-style: none;" type="text" onkeydown="toPage()"/>条记录
<input id="btnFirst" type="button" value="首页" onclick="onFirst()"/>
<input id="btnPrev" type="button" value="上一页" onclick="onPrev()"/>
<input id="btnNext" type="button" value="下一页" onclick="onNext()"/>
<input id="btnLast" type="button" value="尾页" onclick="onLast()"/>
第<input id="txtCurrPage" name="txtCurrPage" style="width: 46px; color: #ff3333;" type="text" onkeydown="toPage()"/>
页(当前页<input id="txtCurrPageRecord" name="txtCurrPageRecord" style="width: 22px;
color: #ff3333; border-top-style: none; border-right-style: none;
border-left-style: none; background-color: white; border-bottom-style: none;" type="text" onkeydown="toPage()"/>条记录）</td>
</tr>
<tr>
<td>
<table width="100%" id="myTable">
<tr style="background-color:Yellow">
<td style="width: 34px; height: 21px;">
Id</td>
<td style="width: 34px; height: 21px;">
序号</td>
<td style="width: 42px; height: 21px;">
工号</td>
<td style="width: 36px; height: 21px;">
姓名</td>
<td style="width: 39px; height: 21px;">
性别</td>
<td style="width: 43px; height: 21px;">
部门</td>
<td style="width: 50px; height: 21px;">
职位</td>
<td style="width: 100px; height: 21px;">
地址</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</form>
</body>
</html> 위 내용은 Xml_javascript paging 내용입니다. 더 많은 관련 내용은 PHP 중국어 홈페이지(www.php.cn)를 참고해주세요!
핫 AI 도구
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Undress AI Tool
무료로 이미지를 벗다
Clothoff.io
AI 옷 제거제
AI Hentai Generator
AI Hentai를 무료로 생성하십시오.
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
뜨거운 주제
7478
15
1377
52
77
11
50
19
19
33
PowerPoint를 사용하여 XML 파일을 열 수 있나요?
Feb 19, 2024 pm 09:06 PM
XML 파일을 PPT로 열 수 있나요? XML, Extensible Markup Language(Extensible Markup Language)는 데이터 교환 및 데이터 저장에 널리 사용되는 범용 마크업 언어입니다. HTML에 비해 XML은 더 유연하고 자체 태그와 데이터 구조를 정의할 수 있으므로 데이터 저장과 교환이 더 편리하고 통합됩니다. PPT 또는 PowerPoint는 프레젠테이션 작성을 위해 Microsoft에서 개발한 소프트웨어입니다. 이는 포괄적인 방법을 제공합니다.
WebSocket과 JavaScript를 사용하여 온라인 음성 인식 시스템을 구현하는 방법
Dec 17, 2023 pm 02:54 PM
WebSocket 및 JavaScript를 사용하여 온라인 음성 인식 시스템을 구현하는 방법 소개: 지속적인 기술 개발로 음성 인식 기술은 인공 지능 분야의 중요한 부분이 되었습니다. WebSocket과 JavaScript를 기반으로 한 온라인 음성 인식 시스템은 낮은 대기 시간, 실시간, 크로스 플랫폼이라는 특징을 갖고 있으며 널리 사용되는 솔루션이 되었습니다. 이 기사에서는 WebSocket과 JavaScript를 사용하여 온라인 음성 인식 시스템을 구현하는 방법을 소개합니다.
WebSocket 및 JavaScript: 실시간 모니터링 시스템 구현을 위한 핵심 기술
Dec 17, 2023 pm 05:30 PM
WebSocket과 JavaScript: 실시간 모니터링 시스템 구현을 위한 핵심 기술 서론: 인터넷 기술의 급속한 발전과 함께 실시간 모니터링 시스템이 다양한 분야에서 널리 활용되고 있다. 실시간 모니터링을 구현하는 핵심 기술 중 하나는 WebSocket과 JavaScript의 조합입니다. 이 기사에서는 실시간 모니터링 시스템에서 WebSocket 및 JavaScript의 적용을 소개하고 코드 예제를 제공하며 구현 원칙을 자세히 설명합니다. 1. 웹소켓 기술
JavaScript와 WebSocket: 효율적인 실시간 일기예보 시스템 구축
Dec 17, 2023 pm 05:13 PM
JavaScript 및 WebSocket: 효율적인 실시간 일기 예보 시스템 구축 소개: 오늘날 일기 예보의 정확성은 일상 생활과 의사 결정에 매우 중요합니다. 기술이 발전함에 따라 우리는 날씨 데이터를 실시간으로 획득함으로써 보다 정확하고 신뢰할 수 있는 일기예보를 제공할 수 있습니다. 이 기사에서는 JavaScript 및 WebSocket 기술을 사용하여 효율적인 실시간 일기 예보 시스템을 구축하는 방법을 알아봅니다. 이 문서에서는 특정 코드 예제를 통해 구현 프로세스를 보여줍니다. 우리
간단한 JavaScript 튜토리얼: HTTP 상태 코드를 얻는 방법
Jan 05, 2024 pm 06:08 PM
JavaScript 튜토리얼: HTTP 상태 코드를 얻는 방법, 특정 코드 예제가 필요합니다. 서문: 웹 개발에서는 서버와의 데이터 상호 작용이 종종 포함됩니다. 서버와 통신할 때 반환된 HTTP 상태 코드를 가져와서 작업의 성공 여부를 확인하고 다양한 상태 코드에 따라 해당 처리를 수행해야 하는 경우가 많습니다. 이 기사에서는 JavaScript를 사용하여 HTTP 상태 코드를 얻는 방법과 몇 가지 실용적인 코드 예제를 제공합니다. XMLHttpRequest 사용
MyBatis 페이징 플러그인의 원리에 대한 자세한 설명
Feb 22, 2024 pm 03:42 PM
MyBatis는 XML과 주석을 기반으로 하는 뛰어난 지속성 레이어 프레임워크입니다. 또한 간단하고 사용하기 쉬운 플러그인 메커니즘도 제공합니다. 그 중 페이징 플러그인은 가장 많이 사용되는 플러그인 중 하나입니다. 이 기사에서는 MyBatis 페이징 플러그인의 원리를 자세히 살펴보고 특정 코드 예제를 통해 설명합니다. 1. 페이징 플러그인 원리 MyBatis 자체는 기본 페이징 기능을 제공하지 않지만 플러그인을 사용하여 페이징 쿼리를 구현할 수 있습니다. 페이징 플러그인의 원리는 주로 MyBatis를 가로채는 것입니다.
JavaScript에서 HTTP 상태 코드를 쉽게 얻는 방법
Jan 05, 2024 pm 01:37 PM
JavaScript에서 HTTP 상태 코드를 얻는 방법 소개: 프런트 엔드 개발에서 우리는 종종 백엔드 인터페이스와의 상호 작용을 처리해야 하며 HTTP 상태 코드는 매우 중요한 부분입니다. HTTP 상태 코드를 이해하고 얻는 것은 인터페이스에서 반환된 데이터를 더 잘 처리하는 데 도움이 됩니다. 이 기사에서는 JavaScript를 사용하여 HTTP 상태 코드를 얻는 방법을 소개하고 구체적인 코드 예제를 제공합니다. 1. HTTP 상태 코드란 무엇입니까? HTTP 상태 코드는 브라우저가 서버에 요청을 시작할 때 서비스가
PHP에서 배열 페이지 매김을 구현하는 가장 좋은 방법
May 04, 2024 pm 02:39 PM
PHP 배열을 페이지화하는 가장 일반적인 두 가지 방법은 array_slice() 함수를 사용하는 것입니다. 건너뛸 요소 수를 계산한 다음 지정된 요소 범위를 추출합니다. 내장 반복자 사용: Iterator 인터페이스를 구현하고 rewind(), key(), current(), next() 및 valid() 메서드를 사용하여 지정된 범위 내의 요소를 탐색합니다.
