问题:用JavaScript编写一个乘法口诀表,然后输出在页面的指定位置。
1.在html部分写一个将要用来存放乘法口诀表的盒子。
<div id="box"> </div>
2.设置一下盒子的样式。
<style> * { margin: 0; padding: 0; } table { /* border: 1px solid #222; */ border-collapse: collapse; margin: 10px auto; } td { border: 1px solid #222; padding: 20px; } #box { width: 1000px; height: 1000px; border: 1px solid red; margin: 100px; } </style>
3.编写js部分的关键代码。
<script> // 九九乘法口诀表 let str = '<table>' //外层循环控制行数 for (let i = 1; i <= 9; i++) { str += '<tr>' //内层循环控制td的个数 for (let j = 1; j <= i; j++) { str += `<td> ${j}x${i}=${j*i} </td>` } str += '</tr>' } str += '</table>' // console.log(str); document.write(str); document.querySelector('#box').innerHTML = str; </script>