2015-03-25 5 views
1

У меня есть div внутри другого div. у родителя есть определенное имя класса, которое специально не применяет к нему CSS. дочерний элемент имеет css, который применяется к нему, в частности, это цвет фона. так это выглядит ...изменить атрибуты css для дочернего объекта при изменении родительского класса

<div id='myparent' class='someclass'> 
    <div id='mychild' class='somebgcolor'></div> 
</div> 

, что я хочу сделать, это изменить цвет фона ребенка DIV при изменении класса родительских дел. поэтому я меняю класс родителя с этим JavaScript ...

document.getElementById('myparent').className = 'someotherclass'; 

и в моем CSS ...

.someclass .somebgcolor { 
    background-color: #369; 
} 
.someotherclass .somebgcolor { 
    background-color: #401; 
} 

, но он не работает. для стартеров исходный цвет фона даже не применяется, и при обновлении класса родительского div цвет фона не применяется. я пропустил что-то фундаментальное в том, как работает css для вложенных элементов?

+2

Кажется, что работает для меня. Какое сообщение об ошибке вы получаете в консоли браузера? – Terry

+0

https://jsfiddle.net/u2s9dg4L/1/ –

ответ

1

Я не думаю, что вам что-то не хватает. Я просто попробовал, и он отлично работает:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Document</title> 
    <style> 
    .someOtherClass { 
     background-color: yellow; 
    } 

    .someOtherClass .someBgColor { 
     background-color: red; 
    } 
    </style> 
</head> 
<body> 
    <div id="myParent" class="someClass"> 
     <div id='myChild' class="someBgColor"> 
      asdasadasd 
     </div> 
    </div> 

    <script> 
     var parent = document.getElementById('myParent'); 
     parent.className = "someOtherClass"; 
    </script> 
</body> 
</html> 
+0

huh, мой плохой. Я только что реализовал одно и то же, но несколько иначе, но функционально то же самое, что и вопрос, и теперь он отлично работает. Я не уверен, почему он не работал раньше, может быть, синтаксическая ошибка в моем коде. будет +1 и отметьте правильный для ваших усилий. благодаря! –

Смежные вопросы