将 css 添加到 jquery 数据表中的特定单元格

Question

我在我的项目中使用 jquery 和数据表。

我现在想要的是在单击按钮时将 CSS 添加到单元格，即更改单元格 color.I 只想更改单个特定单元格值而不是整行

我尝试了下面的方法，但没有用

<table id="food">
    <thead>
        <tr>
            <th>Number</th>
            <th>Name</th>
            <th>Type</th>                         
        </tr>                           
    </thead>    
    <tbody> 
        <tr>
            <td>1</td>
            <td>Apple</td>
            <td>Fruit</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Mango</td>
            <td>Fruit</td>
        </tr>
        <tr>
            <td>3</td>
            <td>Grape</td>
            <td>Fruit</td>
        </tr>
    </tbody>
</table>

<button id='button1'>Click me</button>

这是jquery

$('#button1').click(function(){ 

   //Here I want to change row 1,col 3 to red color

    var cell = table.row(1).column(3).node();
    $(cell).addClass('change-color');

 });

谢谢

Answer 1

您可以像这样获取第 3 列和第 2 行的单元格（零索引）

var nodes = myTable.column(2).nodes();
$(nodes[1]).addClass('change-color);

这里有演示http://jsfiddle.net/dhirajbodicherla/189Lp6u6/19/

Answer 2

您还可以使用增量 i+num

更改定义列的所有值

这适用于 jquery 数据表

var myTable = $('#example2').DataTable(); 
var columnas = new Array();
    columnas[4] = 4;  
$.each(columnas, function(i, v) {  
   var x = i+3;  
   var nodes = myTable.column([x]).nodes();   
   var y = i+3;   
   $.each(nodes, function(y, v) {  
       $(nodes[y]).addClass('change-color');              
   });
});

将 css 添加到 jquery 数据表中的特定单元格

Add css to specific cell in jquery datatables

jquery

datatables