Home > Developer > JavaScript
There are two files: tmh.htm & tt. xml.
The source code is as follows:
Tmh.htm
Copy codeThe Code is as follows:
<! 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 = "">
<Link rel = "stylesheet" href = "../website.css" type = "text/css">
</HEAD>
<BODY>
<Script language = "javascript">
// ***************** Variable-related definitions **************
// * Author: Hai Zi *
// * Email: rautinee@21cn.com *
// * This program can be freely transmitted and used, but please keep this information *
//************************************** **
Var pagenum = 4; // several messages are displayed on each page
Var page = 0;
Var contpage;
Var BodyText = "";
Var xmlDoc = new ActiveXObject ("Microsoft. XMLDOM ");
Var mode = "member ";
Var toolBar;
XmlDoc. async = "false"
XmlDoc. load ("tt. xml ")
// **************** You have changed the field name based on the actual obtained field name.
Header = "<TABLE border = 1> <tr> <td> name </td> <td> icon </td> <td> ip address </td> <td> email </td> <td> date </td> </tr> ";
// Number of retrieved records
MaxNum = xmlDoc. getElementsByTagName (mode). length
// Number of columns per record
Column = xmlDoc. getElementsByTagName (mode). item (0). childNodes
// Number of columns per record
ColNum = column. length
// Page number
PagesNumber = Math. ceil (maxNum/pagenum)-1;
PagesNumber2 = Math. ceil (maxNum/pagenum );
// Previous Page
Function UpPage (page)
{
ThePage = "Previous Page ";
If (page + 1> 1) thePage = "<a href = '# 'onclick = 'javascript: return UpPageGo ()'> previous page </A> ";
Return thePage;
}
Function NextPage (page)
{
ThePage = "next page ";
If (page <pagesNumber) thePage = "<a href = '# 'onclick = 'javascript: return NextPageGo ()'> next page </A> ";
Return thePage;
}
Function UpPageGo (){
If (page> 0) page --;
GetContent ();
BodyText = "";
}
// Current page number
Function currentPage ()
{
Var cp;
Cp = "current is the" + (page + 1) + "page ";
Return cp;
}
// Total number of pages
Function allPage ()
{
Var ap;
Ap = 'Total' + (pagesNumber + 1) + 'page ';
Return ap
}
Function NextPageGo ()
{
If (page <pagesNumber) page ++;
GetContent ();
BodyText = "";
}
// Display the paging Status Bar
Function pageBar (page)
{
Var pb;
Pb = UpPage (page) + "" + NextPage (page) + "" + currentPage () + "" + allPage () + selectPage ();
Return pb;
}
Function changePage (tpage)
{
Page = tpage
If (page> = 0) page --;
If (page <pagesNumber) page ++;
GetContent ();
BodyText = "";
}
Function selectPage ()
{
Var sp;
Sp = "<select name = 'hehe' 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 + "<option value = '" + t + "'>" + (t + 1) + "</option> ";
}
Sp = sp + "</select>"
Return sp;
}
Function getContent ()
{
If (! Page) page = 0;
N = page * pagenum;
EndNum = (page + 1) * pagenum;
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 (page );
BodyText = ""
}
</Script>
<Div id = "showhtml"> </div>
<Script>
If (maxNum = 0)
{
Document. write ("no talent information is found ")
}
Else
{
GetContent ()
}
</Script>
</BODY>
</HTML>
// The following is the tt. xml code.
Copy codeThe Code is as follows:
<? Xml version = "1.0" encoding = "GB2312"?>
<Rautinee>
<Member id = '1'>
<Name> Hai Zi </name>
<LoginName> rautinee </loginName>
<Email> rautinee@btamail.net.cn </email> </member>
<Member id = '2'>
<Name> strong </name>
<LoginName> hehe </loginName>
<Email> rautinee@chinamanagers.com </email> </member>
<Member id = '3'>
<Name> Jin huagang </name>
<LoginName> nature_it </loginName>
<Email> rautinee_sea@hotmail.com </email> </member>
<Member id = '4'>
<Name> simplified </name>
<LoginName> tank </loginName>
<Email> tank@163.com </email> </member>
<Member id = '7'>
<Name> joint venture </name>
<LoginName> kaka </loginName>
<Email> kaka@eyou.com </email> </member>
<Member id = '6'>
<Name> Add an individual </name>
<LoginName> apple </loginName>
<Email> apple@163.com </email> </member>
<Member id = '8'>
<Name> null </name>
<LoginName> sunny </loginName>
<Email> rautinee@eyou.com </email> </member>
<Member id = '10'>
<Name> baby </name>
<LoginName> index </loginName>
<Email> rautinee@21cn.com </email> </member>
<Member id = '12'>
<Name> null </name>
<LoginName> login </loginName>
<Email> webmaster@chinamanagers.com </email> </member>
<Member id = '13'>
<Name> jiang </name>
<LoginName> 123 </loginName>
<Email> japing@chianmanagers.com </email> </member>
<Member id = '14'>
<Name> null </name>
<LoginName> world </loginName>
<Email> rautinee@21cn.com </email> </member>
<Member id = '15'>
<Name> null </name>
<LoginName> swallow </loginName>
<Email> swallow@chinamanagers.com </email> </member>
<Member id = '16'>
<Name> Wei Ge </name>
<LoginName> hotmail </loginName>
<Email> rautinee_sea@hotmail.com </email> </member>
<Member id = '17'>
<Name> null </name>
<LoginName> wrong </loginName>
<Email> wrong@chinamanagers.com </email> </member>
<Member id = '18'>
<Name> null </name>
<LoginName> leah </loginName>
<Email> leah@chinamanagers.com </email> </member>
<Member id = '19'>
<Name> null </name>
<LoginName> ttth </loginName>
<Email> rautinee@21cn.com </email> </member>
</Rautinee>
Currently, only IE5.0 is supported.
If you have any good methods and improvements, please contact me. Thank you.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
