如果其中存在来自innerHTML数组的值，如何将Class添加到单元格或td？答案

【问题标题】：How to addClass to a cell or td if value from an array of innerHTML present in it?如果其中存在来自innerHTML数组的值，如何将Class添加到单元格或td？
【发布时间】：2026-02-06 18:40:01
【问题描述】：

最近开始学习 JQuery 并且有一段时间没有在这方面取得成功。我正在尝试将一个 innerHTML 数组（来自 DB 的值）添加到现有数组（类似于“Push”），并为这些数组值的 td 提供一个类。

我的代码是：

$('td').click(function() {
    $(this).toggleClass('active-select-color');
    if($('td').hasClass('active-select-color'))
        $('#mark-now').show();
    else
        $('#mark-now').hide();
});

/* Here I need to add class to "td" containing values from 'PreDates' array */
/* And then push values to array 'selected' */
var PreDates = ["1","2"];
PreDates.adClass('active-select-color');

var selected = [];
var tbl = document.getElementById("calender-table");
if (tbl != null) {
for (var i = 0; i < tbl.rows.length; i++) {
for (var j = 0; j < tbl.rows[i].cells.length; j++)
tbl.rows[i].cells[j].onclick = function () {
        var item = getval(this);
        if($(this).hasClass('active-select-color')){ 
        selected.push(item);
    } else {
        var index = selected.indexOf(item);
        selected.splice(index, 1);
        }
document.getElementById("dates").value = selected;
        }
    }
}
function getval(cel) {
  return cel.innerHTML;
}

HTML表格是：

<table border="1" id="calender-table">
<tr><td>1</td><td>2</td></tr>
<tr><td>3</td><td>4</td></tr>
</table>

<input id="dates" type="text" value="" />
<div id="mark-now">Mark As Booked<div>

提前致谢。

【问题讨论】：

您在对addClass 的调用中缺少一个“d”。
@Carcigenicate d不是问题，是一个数组，addClass放在一个数组上，看起来眼熟？ :-)
@sarepta 不熟悉，但很奇怪，只有 HTML 元素有 addClass 方法。

标签： jquery

【解决方案1】：

您可以遍历所有tds 并将值与数组进行比较。如果在数组中找到，则 addClass 到那个 td

    /* Here I need to add class to "td" containing values from 'PreDates' array */
    /* And then push values to array 'selected' */
    var PreDates = ["1","2"];
    //PreDates.addClass('active-select-color');
    var selected = [];
   $("#calender-table td").each(function() {
     if (isInArray($(this).html(), PreDates)) {
       $(this).addClass('active-select-color');
       selected.push($(this).html());
     }
     document.getElementById("dates").value = selected;
    });

    function isInArray(value, array) {
      return array.indexOf(value) > -1;
    }

【讨论】：

感谢@KumarM 的回答。顺便说一句，我也找到了解决方案（请检查我的解决方案）。你认为这其中的任何一个都会比另一个更快吗？我很乐意接受你的回答，但只是一个想法:-)
哦，我明白了。两者几乎相似，但本机 javascript 函数在可能的情况下使用起来更快更好。根据这个*.com/questions/1883663/should-i-use-jquery-inarray，javascript array.indexOf 比 jquery `inArray' 快:)
现在我真正的问题是 PreDates 数组是一个 php 数组.. 我可以像 <?= json_encode($PreDates); ?> 一样在 Jquery 中回显它......但它不起作用......这在源代码中回显为 @ 987654328@，而我需要它为["1","2","3","4"]
尝试使用function isInArray(value, array) { return array.indexOf(Number(value)) > -1; } 在这里我将值类型转换为整数。

【解决方案2】：

我完全删除了-

var PreDates = ["1","2"];
PreDates.adClass('active-select-color');
var selected = [];

替换为：

var selected = ["1","2"];
$("td").each(function() {
  if(jQuery.inArray($(this).html(), selected) !== -1) {
  $(this).addClass("active-select-color");
  }
});

【讨论】：