layui table設(shè)置某一行的字體顏色方法
table自帶的可以設(shè)置某一個(gè)單元格顏色,必須根據(jù)內(nèi)容來(lái)修改,對(duì)于很多列同時(shí)修改并不方便,直接使用js操作比較簡(jiǎn)單。
首先自定義一個(gè)div,內(nèi)部存放table,根據(jù)class找到table,然后找到行tr,修改其樣式中的顏色。
//設(shè)置layui datatable的某一行的顏色
//TabDivId:tab父div id;RowIndex:行序列號(hào),從0開(kāi)始;ColorString:顏色字符串,如'#123456'
function Layui_SetDataTableRowColor(TabDivId,RowIndex, ColorString)
{
try
{
var div = document.getElementById(TabDivId);
if(div != null) //找到對(duì)象了
{
var table_main = div.getElementsByClassName('layui-table-main'); //通過(guò)class獲取table_main
if (table_main != null && table_main.length > 0)
{
var table = table_main[0].getElementsByClassName('layui-table'); //通過(guò)class獲取table
if (table != null && table.length > 0) {
var trs = table[0].querySelectorAll("tr");
if (trs != null && trs.length > 0) {
trs[RowIndex].style.color = ColorString;
}
}
}
}
}
catch(e)
{
console.log(e.message);
}
}
注意調(diào)用時(shí)必須要等table渲染完成后進(jìn)行調(diào)用,可以放到渲染完成事件中調(diào)用。
, done: function (res, curr, count) {
//如果是異步請(qǐng)求數(shù)據(jù)方式,res即為你接口返回的信息。
//如果是直接賦值的方式,res即為:{data: [], count: 99} data為當(dāng)前頁(yè)數(shù)據(jù)、count為數(shù)據(jù)總長(zhǎng)度
console.log(res);
//得到當(dāng)前頁(yè)碼
console.log(curr);
//得到數(shù)據(jù)總量
console.log(count);
Layui_SetDataTableRowColor('tabl_panel_id1', 0, '#2c08b1');
}
最終效果如下:

第一行的顏色變?yōu)槟阆朐O(shè)置的顏色了。
以上這篇layui table設(shè)置某一行的字體顏色方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
如何讓每個(gè)Http請(qǐng)求都自動(dòng)帶上token
這篇文章主要介紹了如何讓每個(gè)Http請(qǐng)求都自動(dòng)帶上token問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-03-03
使用JS代碼實(shí)現(xiàn)頁(yè)面添加水印的方法詳解
這篇文章主要介紹了使用80 行 JS 代碼實(shí)現(xiàn)頁(yè)面添加水?。何淖炙 ⒍嘈形淖炙?、圖片水印、文字&圖片水印,文中通過(guò)代碼示例給大家介紹的非常詳細(xì),具有一定的參考價(jià)值,需要的朋友可以參考下2024-05-05
JS操作COOKIE實(shí)現(xiàn)備忘記錄的方法
這篇文章主要介紹了JS操作COOKIE實(shí)現(xiàn)備忘記錄的方法,涉及JavaScript針對(duì)cookie的讀寫(xiě)操作相關(guān)技巧,需要的朋友可以參考下2016-04-04
使用mixins實(shí)現(xiàn)elementUI表單全局驗(yàn)證的解決方法
這篇文章主要介紹了使用mixins實(shí)現(xiàn)elementUI表單的全局驗(yàn)證的解決方法,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-04-04
doctype后如何獲得body.clientHeight的方法
doctype后如何獲得body.clientHeight的方法...2007-07-07
JavaScript動(dòng)態(tài)改變HTML頁(yè)面元素例如添加或刪除
HTML頁(yè)面元素可以通過(guò)js動(dòng)態(tài)改變,比如可以向HTML中添加元素或刪除某個(gè)元素,下面為示例代碼,感興趣的朋友不要錯(cuò)過(guò)2014-08-08

