<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/**
* 学生对象
*/
function Student(name, age) {
this.name = name;
this.age = age;
}
Student.prototype.showInfo = function(tableEle, i) {
if (tableEle instanceof HTMLTableElement && (typeof i) === "number") {
var row = tableEle.insertRow(i + 1);
var cellfirst = row.insertCell(0);
var cellsecond = row.insertCell(1);
var cellthird = row.insertCell(2);
cellfirst.appendChild(document.createTextNode(i + 1));
cellsecond.appendChild(document.createTextNode(this.name));
cellthird.appendChild(document.createTextNode(this.age));
}
}
</script>
</head>
<body>
</body>
<script type="text/javascript">
var stu1 = new Student("刘兴", 15);
var stu2 = new Student("张绍强", 16);
var stu3 = new Student("王超", 18);
var students = [stu1, stu2, stu3];
var tableEle = document.createElement("table");
var _1TrEle = tableEle.insertRow(0);
var _1Tr_1CellEle = _1TrEle.insertCell(0);
var _1Tr_2CellEle = _1TrEle.insertCell(1);
var _1Tr_3CellEle = _1TrEle.insertCell(2);
_1Tr_1CellEle.appendChild(document.createTextNode("序号"));
_1Tr_2CellEle.appendChild(document.createTextNode("姓名"));
_1Tr_3CellEle.appendChild(document.createTextNode("年龄"));
for (var i = 0; i < students.length; i++) {
students[i].showInfo(tableEle, i);
}
tableEle.setAttribute("border", 1);
tableEle.setAttribute("style", "text-align: center");
document["body"].appendChild(tableEle);
alert((null == undefined) + " " + (null === undefined));
alert((1 == "1") + " " + (1 === "1"));
</script>
</html>
用javascript语言循环输出表格
最新推荐文章于 2023-03-10 18:04:33 发布