I am trying to create a table using the arrays for a program outline for school. How do I make the second array (num) line up next the course title. Right now it is just stacking below them in the same column….
<script>
var titl = ["Oral Communication","Applications/Concepts","SQL Programming","HTML and Dreamweaver","Javascript","Flash","XML","Cascading Style Sheets","XSL","ASP.NET","PHP/MySQL","Windows Operating Systems","Digital Imaging with Photoshop","Web Development Internship"];
var num = ["ENG171","CIT110","CIT236","CMT111","CMT113","CMT115","CMT117","CMT125","CMT211-see note*","CMT215","CMT241","CIT268","VMA105","CMT299"];
document.write('<table>')
document.write('<tr><th>Web Development Concentration Courses</th></tr>');
for (var i = 0; i < titl.length; i++)
{
document.write('<tr><td>' + titl[i] + '</td></tr>');
}
for (var j = 0; j < num.length; j++)
{
document.write('<tr><td>' + num[j] + '</td></tr>');
}
document.write('</table>');
</script>
2
Answers
You cannot split things when you are constructing HTML. Also, please do not use
document.write
, as it is dangerous.Also, the main solution is to combine the loops. I am doing it by checking the lengths of the two arrays to be same:
Preview
Also, giving the
<th>
acolspan="2"
will give you better results:Combine the two loops