Обработка цветов CSS с комбинацией кодовCSS

Разбираемся в CSS
Ответить
Anonymous
 Обработка цветов CSS с комбинацией кодов

Сообщение Anonymous »

У меня есть следующая функция setCSSColors, которая назначает цвета фона тексту, отображаемому в таблице, следующим образом:
Изображение

Код: Выделить всё

 function setCSSColors(cellsInnerText, row, cellsIndex) {
let x = cellsInnerText;
if (x.includes("PET")) {
row.cells[cellsIndex].className = "petClass";
} else if (x.includes("VIC")) {
row.cells[cellsIndex].className = "vicClass";
} else if (x.includes("NED")) {
row.cells[cellsIndex].className = "nedClass";
} else if (x.includes("FAM")) {
row.cells[cellsIndex].className = "famClass";
} else if (x.includes("HEX")) {
row.cells[cellsIndex].className = "hexClass";
} else if (x.includes("TAMRA")) {
row.cells[cellsIndex].className = "tamraClass";
} else if (x.includes("Cy5")) {
row.cells[cellsIndex].className = "cyfiveClass";
}

else if (x.includes("FAM/ZEN/IBFQ")) {
row.cells[cellsIndex].className = "famComboClass";
}
Вышеуказанная функция вызывается из другой функции, например:

Код: Выделить всё

function colorTableCells(tableObject, pageName) {
if (pageName === "pageOne") {
var tables = tableObject;
for (var j = 0; j < tables.length; j++) {
var table = tables[j];
for (var i = 0; i < table.rows.length; i++) {
if (i != 0) {
var row = table.rows[i];
if (row.cells.length > 1) {
var x = row.cells[1].innerText;
setCSSColors(x, row, 1);
}
}
}
}
} else if (pageName === "pageTwo" || pageName === "pageThree") {
var table = tableObject;
for (var i = 0; i < table.rows.length; i++) {
if (i != 0) {
var row = table.rows[i];
if (row.cells.length > 1) {
let x = row.cells[2].innerText;
setCSSColors(x, row, 2);
}
}
}
}
}
Обоснование двух приведенных выше операторов if:
Для pageOne я получаю tableObject вот так в моем коде pageOne, который использовал getElementsByName:

Код: Выделить всё

var tables = document.getElementsByName("myTableInPageOne");
let pageName = "pageOne";
colorTableCells(tables,pageName)
тогда как в случае двух других страниц pageTwo и pageThree
у меня это так (с использованием getElementsById) :

Код: Выделить всё

var tables = document.getElementsById("myTableInPageTwo");
let pageName = "pageTwo";
colorTableCells(tables,pageName)
Аналогично для третьей страницы.
И вот мои CSS-цвета:

Код: Выделить всё

famClass {
background: lightblue;
}
.famComboClass {
background: #034694;
}

.petClass {
background: red;
}

.nedClass {
background: yellow;
}

.vicClass {
background: lightgreen;
}

.hexClass {
background: #40ff00;
}

.tamraClass {
background: orange;
}

.cyfiveClass {
background: pink;
}
Я пытаюсь применить другой цвет к этому сочетанию FAM/ZEN/IBFQ с помощью CSS famComboClass, но он все равно добавляет famClass голубого цвета.Есть идеи, как применить определенный цвет к указанной выше комбинации? famClass, кажется, имеет приоритет над famClassCombo.

Подробнее здесь: https://stackoverflow.com/questions/790 ... n-of-codes
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»