JavaScript xml 기술로 페이징 브라우징_javascript 기술 구현-JS 튜토리얼-php.cn

집

웹 프론트엔드

JS 튜토리얼

JavaScript xml 기술로 페이징 브라우징_javascript 기술 구현

May 16, 2016 pm 07:02 PM

javascript xml 페이지에서 찾아보기

tmh.htm & tt.xml 두 개의 파일이 있습니다
소스 코드는 다음과 같습니다.
tmh.htm

코드 복사 코드는 다음과 같습니다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<TITLE> 새 문서 </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT=""> "키워드" CONTENT="">
<META NAME="Description" CONTENT="">
<link rel="stylesheet" href="../website.css" type=" text/css">
</HEAD>
<BODY>
<script 언어="javascript">
//*********** *****변수 관련 정의****************
//* 작성자:Haizai *
//* 이메일:rautinee@21cn.com　*
//*이 프로그램은 자유롭게 배포하고 사용할 수 있으나, 이 정보는 꼭 보관해주세요*
//**************************** ***** ************
var pagenum=4; //각 페이지에 표시되는 정보 수
var page=0>var contpage ;
var BodyText="" ;
var xmlDoc = new ActiveXObject("Microsoft.XMLDOM")
var mode="member"
xmlDoc.async=" false"
xmlDoc.load( "tt.xml")
//****************** 얻은 실제 필드 이름을 기반으로 이 위치를 변경할 수 있습니다
header="gt; ;<td></td><td>날짜</td></td><td></td></tr>";
//숫자 검색된 레코드 수
maxNum = xmlDoc.getElementsByTagName(mode).length
//각 레코드의 열 수
column=xmlDoc.getElementsByTagName(mode).item(0).childNodes
// 각 레코드의 열 수 열 수
colNum=column.length
//페이지 수
PagesNumber=Math.ceil(maxNum/pagenum)-1
PagesNumber2=Math.ceil( maxNum/pagenum);
//이전 페이지
function UpPage(page)
{
thePage="이전 페이지"
if(페이지 1>1) thePage="<A HREF='#' onclick ='Javascript:return UpPageGo()'>이전 페이지</A>";
return thePage;
}
function NextPage(페이지)
{
thePage="한 페이지 이후"
if(page<pagesNumber) thePage="<A HREF='#' onclick='Javascript:return NextPageGo()'>다음 페이지</A>"; > 페이지 반환
}
function UpPageGo(){
if(page>0) 페이지--
BodyText=""
/ /현재 페이지 번호
function currentPage()
{
var cp
cp="현재 페이지는 " (페이지 1) ""
return cp; }
//총 페이지 수
function allPage()
{
var ap
ap='total' (pagesNumber 1) 'pages'
return ap
}
function NextPageGo()
{
if (page<pagesNumber) page
getContent()
BodyText=""
//페이지 표시 상태 표시줄
function pageBar(페이지)
{
var pb
pb=UpPage(page) "" NextPage(page) "" currentPage() "" allPage() selectPage(); 🎜 > return pb;
}
functionchangePage(tpage)
{
page=tpage
if(page>=0) page--
if (page<pagesNumber) 페이지 ;
getContent();
BodyText="";
}
function selectPage()
{
var sp="<name=' ㅎㅎ ' onChange='javascript:changePage(this.options[this.selectedIndex].value)'>";
//sp="<select name='hehe' onChange='alert(this.options[ this .selectedIndex].value)'>";
sp=sp "<option value=''></option>";
for (t=0;t<=pagesNumber;t )
{
sp=sp "<옵션 값='" t "'>" (t 1) "</option>"
}
sp=sp "< / 선택>"
sp;
} 반환
함수 getContent()
{
if (!page) page=0;
n=페이지*페이지 번호;
endNum=(페이지 1)*페이지 번호;
if (endNum>maxNum) endNum=maxNum;
BodyText=header BodyText;
for (;n<endNum;n )
{
　
BodyText=BodyText "<TR>";
for (m=0;m<=colNum-1;m )
{　
mName=column.item(m).tagName;
BodyText=BodyText ("<TD>" xmlDoc.getElementsByTagName(mName).item(n).text "</TD>");
}
BodyText=BodyText "</TR>"
mm="";
}
showhtml.innerHTML=BodyText "</table>" pageBar(페이지);
BodyText=""
}
</script>
<div id="showhtml"></div>
<스크립트>
if (maxNum==0)
{
document.write("没有检索到合适的人才信息")
}
else
{
getContent()
}
</script>
</BODY>
</HTML>

//下face是tt.xml적대码

复代码代码如下:

<?xml version="1.0" encoding="GB2312"?>  
<rautinee>  
<회원 id='1'>  
<name>海仔</name>  
<loginName>rautinee</loginName>  
<email>rautinee@btamail.net.cn</email></member>  
<회원 id='2'>  
<name>刚强</name>  
<loginName>헤헤</loginName>  
<email>rautinee@chinamanagers.com</email></member>  
<회원 id='3'>  
<name>金华刚</name>  
<loginName>nature_it</loginName>  
<email>rautinee_sea@hotmail.com</email></member>  
<회원 id='4'>  
<name>的简强</name>  
<loginName>탱크</loginName>  
<email>tank@163.com</email></member>  
<회원 id='7'>  
<name>합주</name>  
<loginName>kaka</loginName>  
<email>kaka@eyou.com</email></member>  
<회원 id='6'>  
<name>加个人</name>  
<loginName>apple</loginName>  
<email>apple@163.com</email></member>  
<회원 id='8'>  
<name>null</name>  
<loginName>sunny</loginName>  
<email>rautinee@eyou.com</email></member>  
<회원 id='10'>  
<name>宝贝</name>  
<loginName>색인</loginName>  
<email>rautinee@21cn.com</email></member>  
<회원 id='12'>  
<name>null</name>  
<loginName>login</loginName>  
<email>webmaster@chinamanagers.com</email></member>  
<회원 id='13'>  
<name>jiang</name>  
123  
<email>japing@chianmanagers.com</email></member>  
<회원 id='14'>  
<name>null</name>  
<loginName>세계</loginName>  
<email>rautinee@21cn.com</email></member>  
<회원 id='15'>  
<name>null</name>  
<loginName>삼키기</loginName>  
<email>swallow@chinamanagers.com</email></member>  
<회원 id='16'>  
<name>魏格</name>  
<loginName>hotmail</loginName>  
<email>rautinee_sea@hotmail.com</email></member>  
<회원 id='17'>  
<name>null</name>  
<loginName>잘못됨</loginName>  
<email>wrong@chinamanagers.com</email></member>  
<회원 id='18'>  
<name>null</name>  
리아  
<email>leah@chinamanagers.com</email></member>  
<회원 id='19'>  
<name>null</name>  
ttth  
<email>rautinee@21cn.com</email></member>  
</rautinee>  