如何使用jQuery動態更改表格單元格中的字體

Question

在用戶事件中，我在代碼中的彈出窗口中動態構建html表，我使用以下行來構建表行單元格：

$("<td BGCOLOR='#F9ED6E'><font color='#ff2500'></font></td>").text(object[property]).appendTo(row);

這確實會更改背景顏色，但不會更改字體顏色。是否可以重寫上面的語句以允許也更改字體顏色？ 我懷疑.text（object [property]需要放在“ font color ='＃ff2500'”部分之后，但是我不確定該怎么做？

Answer 1

好吧，我的jQuery並不是很好。 因此，我可以向您展示一種使用普通的舊JavaScript的方法。 這被認為是一種骯臟的方式。 但是它應該可以正常工作。

row.innerHTML = "<td BGCOLOR='#F9ED6E'><font color='#ff2500'>" + object[property] + "</font></td>";

現在，我確定有人可以告訴您在jQuery中執行類似操作的好方法。 另外，如果我“更正確地”執行此操作，則可以在js中創建實際的DOM元素，並將其附加到行中。 但是我認為這可能更容易理解，因為它使用的是您使用的相同技術。 它會很好地工作。

更新：正確的方法
但仍然是香草javascript

var eCell;
eCell = document.createElement("td");
eCell.style.backgroundColor = "#F9ED6E";
eCell.style.color = "#ff2500";
eCell.innerHTML = object[property];

row.appendChild(eCell);

Answer 2

最簡單的方法是使用CSS。

td {color:#fff}

然后，您將不需要使用字體標簽，並且其中的文本將為白色。 順便說一句，我看不到您在表格中輸入了任何內容。

Answer 3

我建議您對所有樣式使用一個類，並將其作為“ td”的屬性插入。 假設您有一個div，要在其中添加獲取該元素所需的td元素，然后添加td。 這是一個如何完成該操作的示例。 很簡單，但是可以給你和想法

$(document).ready(function(){
  $("button").on('click', function(event) {
    event.preventDefault();
    /* Act on the event */
    $("#myDiv").append("<td class='background'></td>");
  });
});