首页请用HTML5和JavaScript实现九九乘法表，奇数行的背景颜色是黄色，偶数行的背景颜色是蓝色

请用HTML5和JavaScript实现九九乘法表，奇数行的背景颜色是黄色，偶数行的背景颜色是蓝色

时间: 2024-09-26 19:09:35 浏览: 30

要使用HTML5和JavaScript实现一个九九乘法表，并根据行的奇偶性设置背景颜色，你可以按照下面的步骤操作：首先，在HTML部分创建一个表格结构： ```html <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>九九乘法表</title> <style> table { border-collapse: collapse; } tr:nth-child(even) { background-color: blue; } tr:nth-child(odd) { background-color: yellow; } </style> </head> <body> <table id="multiplicationTable"></table> <script src="main.js"></script> </body> </html> ``` 然后，在`main.js`文件中添加JavaScript代码来动态填充表格内容： ```javascript window.onload = function() { var table = document.getElementById('multiplicationTable'); for (var i = 1; i <= 9; i++) { var row = table.insertRow(i); // 创建单元格并填充乘积 for (var j = 1; j <= i; j++) { var cell = row.insertCell(j); cell.textContent = i + 'x' + j + ' = ' + i*j; } } }; ``` 这个代码会在页面加载完成后，生成一个9x9的乘法表。奇数行有黄色背景，偶数行有蓝色背景。

阅读全文