原生的js实现99乘法表实现选择下拉框颜色，改变背景颜色为选中的颜色
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>九九乘法表</title> <style> p { width: 100px; display: inline-block; padding: 10px; margin: 0; font-size: 20px; background-color: #FFFFFF; border-top: 1px solid black; border-right: 1px solid black; } div { display: block; } #zheng99 { width: auto; display: inline-block; border-left: 1px solid #000000; border-bottom: 1px solid #000000; } #group{ display: block; margin-top: 20px; width: 200px; height: 50px; font-size: 20px; } #bianse{ display: inline-block; width: 200px; height: 60px; margin-top: 20px; font-size: 20px; } </style> </head> <body> <h1>9*9乘法表</h1> <div id="zheng99"></div> <select id="group"> <option value="red">红色</option> <option value="yellow">黄色</option> <option value="green">绿色</option> </select> <button onclick="changeColor()" id="bianse">改变颜色</button> </body> <script> window.onload = function() { for(let i = 1; i <= 9; i++) { divs = document.getElementById("zheng99").innerHTML += "<div></div>"; for(let j = 1; j <= i; j++) { document.getElementById("zheng99").getElementsByTagName("div")[i - 1].innerHTML += "<p>" + j + " x " + i + " = " + (j * i) + "</p>"; } } }; function changeColor() { let tag = document.getElementsByTagName(\'p\'); let select = document.getElementById(\'group\'); let index = select.selectedIndex; let group = select.options[index].value; for (let i = 0;i < tag.length; i++){ tag[i].style.backgroundColor = group; } } </script> </html>