js代码如下：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>读取XML，解析生成表格</title>
<script language="javascript">
function delrow(i){
//删除第i行
if(confirm("确定要该记录吗？")){
var row = document.getElementById("row"+i);
var tbl = row.parentNode;
tbl.removeChild(row);
}
}
function loadXML(handler) {
var url = "students.xml";
if(document.implementation&&document.implementation.createDocument) {
var xmldoc = document.implementation.createDocument("", "", null);
xmldoc.onload = handler(xmldoc, url);
xmldoc.load(url);
}
else if(window.ActiveXObject) {
var xmldoc = new ActiveXObject("Microsoft.XMLDOM");
xmldoc.onreadystatechange = function() {
if(xmldoc.readyState == 4) handler(xmldoc, url);
}
xmldoc.load(url);
}
}
function makeTable(xmldoc, url) {
var table = document.createElement("table");
table.setAttribute("border","1");
table.setAttribute("width","600");
table.setAttribute("class","studList");
var studListDiv = document.getElementById("studentList");
studListDiv.appendChild(table);
var caption = "Student Data from " + url;
table.createCaption().appendChild(document.createTextNode(caption));
var header = table.createTHead();
var headerrow = header.insertRow(0);
headerrow.insertCell(0).appendChild(document.createTextNode("姓名"));
headerrow.insertCell(1).appendChild(document.createTextNode("学号"));
headerrow.insertCell(2).appendChild(document.createTextNode("性别"));
headerrow.insertCell(3).appendChild(document.createTextNode("操作"));
var student = xmldoc.getElementsByTagName("student");
for(var i=0;i<student.length;i++) {
var s = student[i];
var name = s.getAttribute("name");
var stuNo = s.getElementsByTagName("studentID")[0].firstChild.data;
var sex = s.getElementsByTagName("sex")[0].firstChild.data;
if (sex=="1")
sex="男";
else
sex="女";
var row = table.insertRow(i+1);
row.setAttribute("id","row"+i);
row.insertCell(0).appendChild(document.createTextNode(name));
row.insertCell(1).appendChild(document.createTextNode(stuNo));
row.insertCell(2).appendChild(document.createTextNode(sex));
var del = row.insertCell(3).appendChild(document.createElement("a"));
del.setAttribute("href","javascript:delrow("+i+")");
del.innerHTML = "删除";
}
}
</script>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body onLoad="loadXML(makeTable)">
<div id="studentList"></div>
</body>
</html>
xml文件如下：
<?xml version="1.0"?>
<students>
<student name="曹智">
<studentID>1211102 </studentID>
<sex>1</sex>
</student>
<student name="孙豪">
<studentID>01212305</studentID>
<sex>1</sex>
</student>
<student name="陈建林">
<studentID>02211101</studentID>
<sex>1</sex>
</student>
<student name="林晟思">
<studentID>02211102</studentID>
<sex>1</sex>
</student>
<student name="廖翠华">
<studentID>02211103</studentID>
<sex>0</sex>
</student>
<student name="何利欢">
<studentID>02211104</studentID>
<sex>0</sex>
</student>
<student name="徐文君">
<studentID>02211105</studentID>
<sex>0</sex>
</student>
<student name="甘四喜">
<studentID>02211106</studentID>
<sex>1</sex>
</student>
<student name="尤安康">
<studentID>02211107</studentID>
<sex>1</sex>
</student>
<student name="王俊凯">
<studentID>02211108</studentID>
<sex>1</sex>
</student>
<student name="王金龙">
<studentID>02211109</studentID>
<sex>1</sex>
</student>
<student name="董萌">
<studentID>02211110</studentID>
<sex>1</sex>
</student>
<student name="姚茂">
<studentID>02211111</studentID>
<sex>0</sex>
</student>
<student name="梁亮">
<studentID>02211112</studentID>
<sex>1</sex>
</student>
<student name="蔡丹青">
<studentID>02211113</studentID>
<sex>0</sex>
</student>
<student name="周玲琍">
<studentID>02211114</studentID>
<sex>0</sex>
</student>
<student name="陈小勇">
<studentID>02211115</studentID>
<sex>1</sex>
</student>
<student name="阮瑛">
<studentID>02211116</studentID>
<sex>1</sex>
</student>
<student name="顾杰">
<studentID>02211117</studentID>
<sex>1</sex>
</student>
<student name="钱颀峰">
<studentID>02211118</studentID>
<sex>1</sex>
</student>
<student name="龚剑虹">
<studentID>02211119</studentID>
<sex>0</sex>
</student>
<student name="岑丰其">
<studentID>02211120</studentID>
<sex>1</sex>
</student>
<student name="叶丹">
<studentID>02211121</studentID>
<sex>0</sex>
</student>
<student name="卢童鑫">
<studentID>02211122</studentID>
<sex>1</sex>
</student>
<student name="黄小锋">
<studentID>02211123</studentID>
<sex>1</sex>
</student>
<student name="蓝飞燕">
<studentID>02211124</studentID>
<sex>0</sex>
</student>
<student name="郑坚">
<studentID>02211125</studentID>
<sex>0</sex>
</student>
<student name="胡军">
<studentID>02211126</studentID>
<sex>1</sex>
</student>
<student name="郑瑶">
<studentID>02211127</studentID>
<sex>0</sex>
</student>
<student name="尹科峰">
<studentID>02211128</studentID>
<sex>1</sex>
</student>
<student name="祁竹坚">
<studentID>02211129</studentID>
<sex>1</sex>
</student>
<student name="杨玲君">
<studentID>02211130</studentID>
<sex>0</sex>
</student>
<student name="缪文伟">
<studentID>02211131</studentID>
<sex>1</sex>
</student>
<student name="卢琦蓓">
<studentID>02211132</studentID>
<sex>0</sex>
</student>
<student name="周凤玲">
<studentID>02211133</studentID>
<sex>0</sex>
</student>
<student name="李海顺">
<studentID>02211134</studentID>
<sex>1</sex>
</student>
<student name="陈森">
<studentID>02211135</studentID>
<sex>1</sex>
</student>
<student name="金路燕">
<studentID>02211136</studentID>
<sex>0</sex>
</student>
<student name="冯迪佳">
<studentID>02211301</studentID>
<sex>0</sex>
</student>
<student name="施希乐">
<studentID>02211302</studentID>
<sex>0</sex>
</student>
<student name="王莹">
<studentID>02211303</studentID>
<sex>0</sex>
</student>
<student name="王怡">
<studentID>02211304</studentID>
<sex>0</sex>
</student>
<student name="费菲">
<studentID>02211305</studentID>
<sex>0</sex>
</student>
<student name="叶彦佚">
<studentID>02211306</studentID>
<sex>0</sex>
</student>
<student name="江东梅">
<studentID>02211307</studentID>
<sex>0</sex>
</student>
<student name="黄瑶涵">
<studentID>02213134</studentID>
<sex>0</sex>
</student>
<student name="王芳">
<studentID>02213212</studentID>
<sex>0</sex>
</student>
</students>
1180
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
