javascript - 根据他的数值更改 td 元素的背景颜色

标签 javascript jquery html css

我有一个表结构,我想根据值更改背景颜色。

例如

<td class="tg-yw42">0</td>
<td class="tg-yw43">1</td>
<td class="tg-yw44">0</td>

因此,如果值为 => 0,则应用绿色背景,否则保持原样。

希望这是有道理的

最佳答案

您可以遍历表格行并根据表格单元格 text == 0 的条件应用 css

$("table td").map(function () {
  if (parseInt($(this).text()) === 0) $(this).css("background-color", "green")
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<table>
	<tr>
		<td class="tg-yw42">0</td>
		<td class="tg-yw43">1</td>
		<td class="tg-yw44">0</td>
	</tr>
</table>

ES6 方式:

$("table td").map((i, el) => parseInt($(el).text()) === 0 ? $(el).css("background-color", "green") : "")

关于javascript - 根据他的数值更改 td 元素的背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46527027/

相关文章:

javascript - 单击标题可对表格进行排序

javascript - 编辑/删除 wordpress 站点中的数据表行

javascript - 从 null 更新后 Highcharts 不显示工具提示

javascript - 在 JavaScript 中,如何检查数组是否有重复的多个值?

php - 用户单击时如何使用弹出 Pane 创建图像?

html - 在 IE EDGE 中,文本未在 flexbox 内换行

html - Google Chrome 浏览器的 HTML、CSS 中的超链接问题

html - 如何永久设置页脚位置

javascript - 将 Typescript 添加到现有 asp.net 4 Webforms 项目的推荐方法

jquery - 上传按钮 : Style with CSS?