Форум

nanoT1m · #1 (**permalink**) 23.09.2012, 18:58

Здравствуйте!

Хочу изменить цвет текста в нескольких ячейках таблицы при помощи js.
прочитал про dom и попытался сделать что-то такое:

table.rows.item(1).cells.item(1).style.color

но конечно же ничего не вышло (= как быть?

eirnvn · #2 (**permalink**) 23.09.2012, 19:34

Надо например, так: table.rows[3].style.backgroundColor = "red";

eirnvn · #3 (**permalink**) 23.09.2012, 19:36

Или так: table.rows[4].cells[2].style.backgroundColor = 'blue';

nanoT1m · #4 (**permalink**) 23.09.2012, 19:47

Сообщение от eirnvn

Или так: table.rows[4].cells[2].style.backgroundColor = 'blue';

Спасибо большое (= столько парился над этим

Ljubin · #5 (**permalink**) 18.12.2013, 03:32

eirnvn,
Поправте мой вариант пожалуста.

Вот табличка.

<body onload="Red();">
<table>
<tr><td id = "red_num">100</td></tr>
</table>
</body>

Функция.

function Red()
{
    color_num = document.getElementById("red_num").innerHTML;// получает цифру из ячейки таблицы
        if(color_num !=0)
        {
          document.getElementById("red_num").style.backgroundColor = "#FF0000";// Меняет цвет фона ячейки
        }  
}

Надо бы, чтобы менялся цвет цифры 100, а не фона ячейки.
И ещё, чтобы переменная color_num - строго не ровнялась нулю.
При таком варианте (color_num !==0) функция почему-то вообще не работает.
p.s. Если можно, дайте ссылку, где об этом можно почитать подробнее. Только не на справочник по JS.
Заранее спасибо.

рони · #6 (**permalink**) 18.12.2013, 03:38

Сообщение от Ljubin

Надо бы, чтобы менялся цвет

http://htmlbook.ru/css/color

Сообщение от Ljubin

переменная color_num - строго не ровнялась нулю

сделайте из строки color_num число потом сравнивайте

рони · #7 (**permalink**) 18.12.2013, 03:39

Сообщение от Ljubin

~~получает цифру~~ из ячейки таблицы

получает строку

Ljubin · #8 (**permalink**) 18.12.2013, 06:02

Разобрался...

Но, это работает если значение в ячейке статичное.

function Red()
{
    color_num = parseFloat(document.getElementById("red_num").innerHTML);// Преобразовует строку в число
    if(num !==0)
    {
       document.getElementById("red_num").style.color = "red";// Меняет чвет чила на красный
    }
    else
    {
       document.getElementById("red_num").style.color = "green";// Меняет чвет чила на зелёный
    {      
}

А, у меня значение выводится вот так.

<body onload="Red();">

<table>
<tr><td id = "red_num"><?=$item['schet'];?></td></tr>// Число выводится из массива циклом PHP
</table>

</body>

И остаётся всё время красным.!?!?

ruslan_mart · #9 (**permalink**) 18.12.2013, 06:20

Ljubin, так у Вы уже определитесь, color_num или num? У Вас в if - num, но такой переменной нет.

function red() {
   var elem = document.getElementById('red_num');
   elem.style.color = +elem.innerHTML ? 'green' : 'red';
}

Ljubin · #10 (**permalink**) 18.12.2013, 16:10

Запутался...
У себя я поменял названия переменных, а тут нет, ну чтоб...
Короче, давайтека ещё раз.

Таблица.

<body onload="Show();">
<table>

<?php foreach($card_pay_list as $item):?>
<tr>
<td><p class = "text"><?=$item['renta'];?></p></td>
<td id = "num"><p class = "text"><?=$item['schet'];?></p></td>// Число выводится из массива циклом foreach PHP
</tr>
<?php endforeach;?>

</table>
</body>

Стили CSS.

div#content p.text{/*текст в таблицах*/
    font-family:sans-serif;
    font-style:normal;
    font-size:18px;
}

Функция работает если цифру указать явно. Если её вывести так как в примере выше, то цифра всегда красная.

function Show()
{
    elem = parseFloat(document.getElementById("num").innerHTML);// Преобразовует строку в число
    if(elem !==0)
    {
       document.getElementById("num").style.color = "red";// Меняет чвет числа на красный
    }
    else
    {
       document.getElementById("num").style.color = "green";// Меняет чвет числа на зелёный
      
    }
}

Использовал эту функцию, результат тотже. Цифра всегда красдная.

function Show()
    {
     var elem = document.getElementById('num');
     elem.style.color = +elem.innerHTML ? 'green' : 'red';
    }

Форум

Справочник

Discord чат

Курсы javascript