上学时,我们都学习过九九乘法表,那么,如果我们想要在我们开发的网页中,动态实现九九乘法表该如何编写代码设置呢?接下来,济南网站建设小编就来为大家分享,一个小案例,通过编写JavaScript代码来完成页面中显示九九乘法表的小方法,有兴趣的朋友可以过来关注一下。
关键代码:
<script>
const box = document.getElementById('tableBox');
let html = '<table>';
// 外层循环控制行数(1~9)
for (let i = 1; i <= 9; i++) {
html += '<tr>';
// 内层循环控制每行列数,只打印到i,形成左下三角
for (let j = 1; j <= i; j++) {
html += `<td>${j} × ${i} = ${i * j}</td>`;
}
html += '</tr>';
}
html += '</table>';
box.innerHTML = html;
// 控制台打印纯文本版本
console.log('====控制台九九乘法表====');
for (let a = 1; a <= 9; a++) {
let str = '';
for (let b = 1; b <= a; b++) {
str += `${b}*${a}=${a*b} `;
}
console.log(str);
}
</script>
评论