1. Open notepad++
2. Based on the code as in
http://www.scottandrew.com/weblog/articles/dom_4 ,
write a code to generate the table of 9*9 products. (九九乘法表)
Hint: The javascript code should be enclosed by script tags.
============================================
Lab 15
The 99 Product Table will show below.
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"http-equiv="content-type">
<title>Lab 15</title>
<p><b>The 99 Product Table will show below.</b></p>
<tab><input type="button" value="99 ProductTable" onclick="buildTable()"></tab>
<script>
function buildTable(){
docBody = document.getElementsByTagName("tab").item(0)
myTable = document.createElement("TABLE")
myTable.id ="TableOne"
myTable.border = 1
myTableBody = document.createElement("TBODY")
for (i = 1; i <= 9; i++){
row = document.createElement("TR")
for (j = 1; j <= 9; j++){
cell = document.createElement("TD")
cell.setAttribute("WIDTH","50")
cell.setAttribute("HEIGHT","50")
textVal = i+"*"+j+"="+i*j
textNode = document.createTextNode(textVal)
cell.appendChild(textNode)
row.appendChild(cell)
}
myTableBody.appendChild(row)
}
myTable.appendChild(myTableBody)
docBody.appendChild(myTable)
}
</script>
</head>
<body id="body">
</body>
</html>
<head>
<meta content="text/html; charset=ISO-8859-1"http-equiv="content-type">
<title>Lab 15</title>
<p><b>The 99 Product Table will show below.</b></p>
<tab><input type="button" value="99 ProductTable" onclick="buildTable()"></tab>
<script>
function buildTable(){
docBody = document.getElementsByTagName("tab").item(0)
myTable = document.createElement("TABLE")
myTable.id ="TableOne"
myTable.border = 1
myTableBody = document.createElement("TBODY")
for (i = 1; i <= 9; i++){
row = document.createElement("TR")
for (j = 1; j <= 9; j++){
cell = document.createElement("TD")
cell.setAttribute("WIDTH","50")
cell.setAttribute("HEIGHT","50")
textVal = i+"*"+j+"="+i*j
textNode = document.createTextNode(textVal)
cell.appendChild(textNode)
row.appendChild(cell)
}
myTableBody.appendChild(row)
}
myTable.appendChild(myTableBody)
docBody.appendChild(myTable)
}
</script>
</head>
<body id="body">
</body>
</html>
沒有留言:
張貼留言