Write a JavaScript program that uses looping to print the following table of values. Output the results in an XHTML table. Use CSS to center the data in each column.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- JavaScript by Eduardo Lauro P. Abad -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Web 2 HW: ch 7.16 pg 274</title>
<style type="text/css">
.loop_table { text-align: center }
table.loop_table td { padding: 0px 5px 0px 5px }
</style>
</head>
<body>
<div>
<script type="text/javascript">
document.write("<table class=\"loop_table\" border=\"1\">");
document.write("<tr>");
document.write("<td width=\"10%\"><b>N</b></td>");
document.write("<td width=\"20%\"><b>10*N</b></td>");
document.write("<td width=\"30%\"><b>100*N</b></td>");
document.write("<td width=\"40%\"><b>1000*N</b></td>");
document.write("</tr>");
for (var i = 1; i <= 5; i++)
{
document.write("<tr>");
document.write("<td>" + i + "</td>");
document.write("<td>" + i*10 + "</td>");
document.write("<td>" + i*100 + "</td>");
document.write("<td>" + i*1000 + "</td>");
document.write("</tr>");
}
document.write("</table>");
</script>
</div>
<p><a href="javascript: window.location.reload()">Click here to reload the page.</a></p>
</body>
</html>
Please note that this is in no way the best possible way of doing it. I’m only posting this in my blog so that they are not lost in the future unless something happens to my dedicated server. Plus it is a good way to look back at how you used to write code.
