Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.02.2014, 15:06
Новичок на форуме
Отправить личное сообщение для Lonewi Посмотреть профиль Найти все сообщения от Lonewi
 
Регистрация: 12.02.2014
Сообщений: 8

не работает атрибут class в теге <td>
Подскажите, в чем подвох. 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>
Ответить с цитированием
  #2 (permalink)  
Старый 12.02.2014, 15:30
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

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

Сообщение от Lonewi
document.getElementById('t').getElementsByTagName( 'td')[0].setAttribute('class', 'a')


document.querySelector('#t td').className = 'a';
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #3 (permalink)  
Старый 12.02.2014, 15:42
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

<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>

а так работат
Ответить с цитированием
  #4 (permalink)  
Старый 12.02.2014, 16:40
Новичок на форуме
Отправить личное сообщение для Lonewi Посмотреть профиль Найти все сообщения от Lonewi
 
Регистрация: 12.02.2014
Сообщений: 8

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

document.getElementById('t').getElementsByTagName('td')[0].setAttribute('class', 'a c')
Ответить с цитированием
  #5 (permalink)  
Старый 12.02.2014, 17:07
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

<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>
Ответить с цитированием
  #6 (permalink)  
Старый 12.02.2014, 17:30
Новичок на форуме
Отправить личное сообщение для Lonewi Посмотреть профиль Найти все сообщения от Lonewi
 
Регистрация: 12.02.2014
Сообщений: 8

Работает!
То есть селекторы потомков типа .a.c нужно писать без пробела?
Ответить с цитированием
  #7 (permalink)  
Старый 12.02.2014, 17:39
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

Причем тут селекторы потомков Даниил же кратко тебе намекнул
Сообщение от 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>
Ответить с цитированием
  #8 (permalink)  
Старый 12.02.2014, 17:48
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

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



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как работает функция Class godofjavascript Оффтопик 58 17.12.2012 09:49
Замена значения в store страно работает I3ev ExtJS 0 09.12.2012 14:22
jQyery функция странно работает! Midel Общие вопросы Javascript 4 08.04.2012 13:40
Не работает код внутри циклов DZHETIGAPA Events/DOM/Window 1 21.06.2011 01:03
Динамическая HTML форма (FireFox - работает, IE - не работает) dm1tr1y Общие вопросы Javascript 10 11.12.2009 15:59