Форум

Lonewi · #1 (**permalink**) 12.02.2014, 15:06

Подскажите, в чем подвох. JS класс изменяет, но цвет текста меняется на черный, а не на зеленый.

<html>
<head>
<title>Test1</title>

<style type="text/css">
table .c { color: red } 
.a .c { color: green }
</style>

<script type="text/javascript">
function test1()
{
	//document.getElementById("t").children[0].children[0].children[0].className=('class', 'a');
	document.getElementById('t').getElementsByTagName('td')[0].setAttribute('class', 'a')
}
</script>

</head>

<body onmousedown="test1()">	
<table id="t"> 
    <tr> 
        <td class="c">Текст</td> 
    </tr> 
</table>
</body>

</html>

danik.js · #2 (**permalink**) 12.02.2014, 15:30

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

.a .c{}

Этот селектор выбирает элемент .c, находящийся внутри элемента .a
Ты точно правильный селектор написал?

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

document.getElementById('t').getElementsByTagName( 'td')[0].setAttribute('class', 'a')

document.querySelector('#t td').className = 'a';

Vlasenko Fedor · #3 (**permalink**) 12.02.2014, 15:42

<style type="text/css">
table .c { color: red } 
.a.c { color: green }
</style>

<body onmousedown="test1()">	
<table id="t"> 
    <tr> 
        <td class="c">Текст</td> 
    </tr> 
</table>
<script type="text/javascript">
function test1(){
  	document.querySelectorAll('#t td')[0].className = 'a c'; 
}
</script>

а так работат

Lonewi · #4 (**permalink**) 12.02.2014, 16:40

Спасибо.
А почему тогда так не работает:

document.getElementById('t').getElementsByTagName('td')[0].setAttribute('class', 'a c')

Vlasenko Fedor · #5 (**permalink**) 12.02.2014, 17:07

<style type="text/css">
table .c { color: red } 
.a.c { color: green }
</style>

<body onmousedown="test1()">	
<table id="t"> 
    <tr> 
        <td class="c">Текст</td> 
    </tr> 
</table>
<script type="text/javascript">
function test1(){
  document.getElementById('t').getElementsByTagName('td')[0].setAttribute('class', 'a c');
}
</script>

Lonewi · #6 (**permalink**) 12.02.2014, 17:30

Работает!
То есть селекторы потомков типа .a.c нужно писать без пробела?

Vlasenko Fedor · #7 (**permalink**) 12.02.2014, 17:39

Причем тут селекторы потомков Даниил же кратко тебе намекнул

Сообщение от danik.js

Этот селектор выбирает элемент .c, находящийся внутри элемента .a
Ты точно правильный селектор написал?

<style>
  .a.b {
    color: red;
  }
  .a .b {
    color: green;
  }
</style>
<div class="a b">.a.b
  <div class="b">.a .b</div>
</div>

danik.js · #8 (**permalink**) 12.02.2014, 17:48

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

А почему тогда так не работает:

А зачем так писать-то?
Никогда не пиши .setAttribute('class', 'a'). Всегда пиши .className = 'a'
Вместо всяких getElement[s]By*** используй querySelector/querySelectorAll.
Чо ты упертый-то такой ))

Форум

Справочник

Discord чат

Курсы javascript