javascript - 使用 jQuery 更改我的 Javascript 制作的表格的颜色？

Question

我有两个用于输入高度和宽度的输入框，以及一个用于使用 Javascript 制作表格的按钮。现在我想让每个单元格的颜色在我将鼠标悬停在它们上面时发生变化。最好使用 jQuery。

    function createTable(inRows, inCols) {
       var inRows = document.getElementById('height').value;
       var inCols = document.getElementById('length').value;

       var body = document.getElementsByTagName("body")[0];

           var tbl = document.createElement("table");
           var tblBody = document.createElement("tbody");

            for (var i = 0; i < inRows; i++) {
                var row = document.createElement("tr");

            for (var j = 0; j < inCols; j++) {
                var cell = document.createElement("td");
                row.appendChild(cell);
            }

            tblBody.appendChild(row);
        }

        tbl.appendChild(tblBody);
        body.appendChild(tbl);
    }   

$(document).ready(function() {
    $('td').hover(function() {
        $(this).addClass('black');
    });
});

在我的初学者看来，这看起来不错。但是..它不是。我在正确的轨道上吗？我该如何实现？

Answer 1

我假设您正在使用 CSS 来设置表格的样式，因为您正在为您想要的悬停样式分配一个类？如果是这样，您可以使用纯 CSS 来实现这种效果:

td:hover {background: black;}