javascript - 更改数据表中特定列的颜色
问题描述
我正在尝试自定义默认Datatables的颜色。我设法根据需要更改标题的颜色和字体,但我没有更改每列的颜色。例如,我有一个报告总死亡人数的列,我希望它是红色的。同时我想确保我的标题颜色保持不变。
我的 HTML 代码
<table id="myTable"></table>
<div id="loadingLabel">Loading...</div
JS代码
const getNewCases = async() => {
const response = await fetch('https://covid19.mathdro.id/api/daily/3-18-2020');
const data = await response.json();
let usa = data.filter(val => {
return val.countryRegion === 'US';
});
$('#loadingLabel').hide();
$('#myTable').DataTable({
data: usa,
bLengthChange: false,
bPaginate: false,
scrollY: '50vh',
columns: [
{ data: 'provinceState', title: 'State' },
{ data: 'countryRegion', title: 'Country' },
{ data: 'lastUpdate', title: 'Last Update' },
{ data: 'confirmed', title: 'Confirmed' },
{ data: 'deaths', title: 'Deaths' },
{ data: 'recovered', title: 'Recovered' }
]
});
};
getNewCases();
CSS 代码
thead {
background-color: #2c3e4f;
font-family: monospace;
font-size: 20px;
color: wheat;
}
这是我的JSFIDDLE。
解决方案
您可以使用 nth-child 更改特定列的颜色
tr td:nth-child(5) {
background: red;
}
推荐阅读
- javascript - Drive API V3:使用 Google Apps 脚本进行多块可恢复上传时文件大小错误(缺少 2 个字节)
- c++ - C++ - 构造函数被用于同一个类两次
- .net - 日历图标和文本字段之间的引导日期时间选择器间隙
- php - PHP从api按星期几对课程列表进行排序
- laravel - 无法让 Xdebug 工作
- c - 堆栈的基本实现
- java - org.apache.poi.ss.usermodel 包可以从多个模块访问:poi、poi.ooxm
- javascript - Puppeteer 抛出无效参数错误
- sharepoint - 如何在在线共享点中进行完整的站点集合级别重新索引?
- java - java中的HQL会话