<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<style type="text/css">
table,tr,td {
background-position: center;
border-width: 1px;
border-style: solid;
border-collapse: collapse;
border-color: blue;
text-align: center;
font-size: 20px;
}
table {
width: 800px;
margin-bottom: 20px;
}
tr {
height: 40px;
}
.bordertyle {
font-family: sans-serif;
text-align: center;
}
.btn {
margin-left: 30px;
margin-right: 30px;
}
label {
font-size: 20px;
font-family: sans-serif;
}
</style>
<script language="javascript">
//***********js操作XML*************
//* author:luobin *
//* Email:luobin23628@163.com *
//*********************************
/*
function loadXML(xmlFile){
var xmlDoc;
if(!window.ActiveXObject){
var parser = new DOMParser();
xmlDoc = parser.parseFromString(xmlFile,"text/xml");
}else{
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async="false";
xmlDoc.load(xmlFile);
}
return xmlDoc;
}
*/
//针对两种浏览器，分别获取xmlDocument对象
function loadXML(xmlFile)
{
var xmlDoc;
if(window.ActiveXObject) {
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async=false;
xmlDoc.load(xmlFile);
}
else if(document.implementation&&document.implementation.createDocument){
xmlDoc=document.implementation.createDocument( "", "",null);
xmlDoc.async=false;
xmlDoc.load(xmlFile);
} else{
alert('Your browser cannot handle this script');
}
return xmlDoc;
}
var xmlDoc = loadXML("test.xml");
var members = xmlDoc.getElementsByTagName("member");
var maxRes = members.length;
var pageShow = 5;
var currentPage = 1;
var maxPage = Math.ceil(maxRes/pageShow);
//此方法只能在body标签中或后调用
function retrieve(){
var oDiv = document.createElement("div");
oDiv.id = "showhtml"
oDiv.className = "bordertyle";
if(maxRes){
var oTable = generateTable(oDiv,(currentPage-1)*pageShow,currentPage*pageShow);
var pageInf = document.createElement("div");
var oLabel = document.createElement("label");
oLabel.innerHTML = "共条"+maxRes+"记录,当前第";
pageInf.appendChild(oLabel);
var curLabel = document.createElement("label");
curLabel.innerHTML = currentPage;
curLabel.setAttribute("id","curLabel");
pageInf.appendChild(curLabel);
var oLabel3 = document.createElement("label");
oLabel3.innerHTML = "页,共"+maxPage+"页";
pageInf.appendChild(oLabel3);
oDiv.appendChild(pageInf);
var buttonSet = document.createElement("div")
buttonSet.className = "bordertyle";
var firstBtn = document.createElement("button");
firstBtn.innerHTML = "首页";
firstBtn.id = "firstBtn";
firstBtn.className = "btn";
firstBtn.onclick = function(){
goToPage(1,oTable,curLabel);
};
buttonSet.appendChild(firstBtn);
var preBtn = document.createElement("button");
preBtn.id = "preBtn";
preBtn.innerHTML = "前一页";
preBtn.className = "btn";
preBtn.onclick = function(){
if(currentPage>1){
goToPage(currentPage-1,oTable,curLabel);
}
};
buttonSet.appendChild(preBtn);
var tx = document.createElement("input");
tx.value = currentPage;
tx.id = "tx";
tx.size = "2";
buttonSet.appendChild(tx);
var goBtn = document.createElement("button");
goBtn.innerHTML = "GO";
goBtn.onclick = function(){
var txPage = parseInt(tx.value);
goToPage(txPage,oTable,curLabel);
}
buttonSet.appendChild(goBtn);
var nextBtn = document.createElement("button");
nextBtn.innerHTML = "下一页";
nextBtn.id = "nextBtn";
nextBtn.className = "btn";
nextBtn.onclick = function(){
if(currentPage<maxPage){
goToPage(currentPage+1,oTable,curLabel);
}
};
buttonSet.appendChild(nextBtn);
var lastBtn = document.createElement("button");
lastBtn.innerHTML = "末页";
lastBtn.id = "lastBtn";
lastBtn.className = "btn";
lastBtn.onclick = function(){
goToPage(maxPage,oTable,curLabel);
};
buttonSet.appendChild(lastBtn);
oDiv.appendChild(buttonSet);
}else{
oDiv.innerHTML = "无记录";
}
document.body.appendChild(oDiv);
alterButton();//先把oDiv加到body之后才可调用，害我犯了错误
}
function generateTable(oDiv,start,end){
var oTable = document.createElement("table");
generateTableHead(oTable);
generateTableContent(oTable,start,end);
oDiv.appendChild(oTable);
return oTable;
}
function generateTableHead(oTable){
var oTr = oTable.insertRow(-1);
var oTd = oTr.insertCell(-1);
oTd.innerHTML = "name";//ie支持innerText，ff支持textContent 这里就偷懒的写法，改成innerHTML
/**
if(oTd.innerText){
oTd.innerText = "name";
}else{
oTd.textContent = "name";
}
**/
var oTd2 = oTr.insertCell(-1);
oTd2.innerHTML = "loginname";
var oTd3 = oTr.insertCell(-1);
oTd3.innerHTML = "email";
}
function generateTableContent(oTable,start,end){
end = (end>maxRes)?maxRes:end;
for(var i=start;i<end;i++){
var oTr = oTable.insertRow(-1);//ff中insertRow必须加上参数，而ie默认为-1
oTr.id = members[i].getAttribute("id");
var oTd = oTr.insertCell(-1);
var oName = members[i].getElementsByTagName("name");
oTd.innerHTML = oName[0].firstChild.nodeValue;//刚开始用的oName[0].text,不兼容ff，现在统一替换成oName[0].firstChild.nodeValue
var oTd2 = oTr.insertCell(-1);
var oLoginName = members[i].getElementsByTagName("loginName");
oTd2.innerHTML = oLoginName[0].firstChild.nodeValue;
var oTd3 = oTr.insertCell(-1);
var oEmail = members[i].getElementsByTagName("email");
oTd3.innerHTML = oEmail[0].firstChild.nodeValue;
}
}
function removeTableContent(oTable){
if(oTable.rows.length>1){
for(var i=oTable.rows.length-1;i>=1;i--){
oTable.deleteRow(i);
}
}
}
function alterButton(){
preBtn.disabled = (currentPage<=1)?true:false;
nextBtn.disabled = (currentPage>=maxPage)?true:false;
firstBtn.disabled = (currentPage==1)?true:false;
lastBtn.disabled = (currentPage==maxPage)?true:false;
}
function goToPage(page,oTable){
//此处还要加个正则表达式校验page是数字，js的正则表达式还不会有待进一步学习
if(page<1){
window.alert("您输入的页数小于等于0,请输入一个0到"+maxPage+"的整数");
return;
}
if(page>maxPage){
window.alert("您输入的页数超过了最大页数,请输入一个0到"+maxPage+"的整数");
return;
}
removeTableContent(oTable);
currentPage = page;
var start = (currentPage-1)*pageShow;
var end = currentPage*pageShow;
tx.value = currentPage;
curLabel.innerHTML = currentPage;
generateTableContent(oTable,start,end);
alterButton();
}
</script>
<script type="text/javascript">
</script>
</HEAD>
<BODY>
<script type="text/javascript">
retrieve();
</script>
</BODY>
</HTML>
xml.rar （2个子文件） 
xml 
test.xml 2KB
operxml.html 7KB资源评论
四散
- 粉丝: 68
- 资源: 1万+
最新资源
- Git操作图解(带VS2022集成Git工具)
- Android Studio Ladybug（android-studio-2024.2.1.12-mac-arm.zip.001）
- IKBC机械键盘固件.tar
- python源码教程，超级详细，附开发教程手册，python前端开发，入门级教程，第二章
- TCR+FC型svc无功补偿simulink仿真模型，一共两个仿真，如下图所示，两个其实大致内容差不多，只是封装不同，有详细资料，资料中有相关lunwen，有背景原理和分析，有使用说明，有建模仿真总结
- 蜘蛛分拣机器人工作站工程图机械结构设计图纸和其它技术资料和技术方案非常好100%好用.zip
- 字符串批处理工具（源程序+代码)
- PSAT( Power System Analysis Toolbox)最新说明书.zip
- HTML+JS获取地理位置（经纬度）
- 基于simulink的车辆坡度与质量识别模型，扩展卡尔曼滤波，估计曲线与实际误差合理
- HTML+JS教程-实现图片页面内拖拽、拖放
- python源码教程，超级详细，附开发教程手册，python前端开发，入门学习第三章
- 神经网络基本概念及其在人工智能领域的应用概述
- EEMD算法应用于信号去噪.zip
- 使用comsol仿真软件 利用双温方程模拟飞秒激光二维移动烧蚀材料 可看观察温度与应力分布 周期为10us，变形几何部分本人还在完善学习中 三维的也有 还有翻阅的lunwen文献一起打包
- Android Studio Ladybug（android-studio-2024.2.1.12-windows-exe.zip.002）
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
