如何在Javascript中更改表格单元格背景答案

【问题标题】：How to change table cell background in Javascript如何在Javascript中更改表格单元格背景
【发布时间】：2017-06-12 05:57:32
【问题描述】：

我有这样的 HTML 表格：

<table>
    <tr>
        <td>Cell 1</td>
    </tr>
    <tr>
        <td>Cell 2</td>
    </tr>
    <tr>
        <td>Cell 3</td>
    </tr>
</table>

如何在此单元格中移动鼠标时更改单元格的背景？如果光标离开单元格，背景必须保留，但如果光标移动到另一个单元格，它必须重置背景。

【问题讨论】：

您的问题到底是什么 - JS 部分，CSS 部分......？目前，这看起来像是“为我编写完整代码”类型的问题。
有可用的框架吗？（jquery、原型、mootools 等）
没有使用框架。如果我只能使用 css 那就太好了。

标签： javascript html html-table cell

【解决方案1】：

由于您需要突出显示一个单元格，因此如果您包含 jQuery，则可以使用此代码。

(function() {

   var current_cell;

   $('td').bind('mouseenter', function() {
      if (current_cell) {
         current_cell.removeAttr('id');
      };
      current_cell = $(this);
      current_cell.attr('id', 'highlight');
   });
})();

然后只需使用一点 css

td#highlight {
  background: ... ;
}

【讨论】：