Получение доступа к дочерним элементам через класс
Здравствуйте! Имею следующий код:
<DOCTYPE !html>
<html>
<head>
</head>
<body>
<div id="test">
<h1>First Child</h1>
<p>Last Child</p>
</div>
<div class="test2">
<h1>First Child #2</h1>
<p>Last Child #2</p>
</div>
<div class="test2">
<h1>First Child #2</h1>
<p>Last Child #2</p>
</div>
<script>
document.getElementById('test').lastElementChild.style.color = 'red';
//document.getElementById('test').children[1].style.color = 'red';
//document.getElementsByClassName('test2').lastElementChild.style.color = 'green';
//document.getElementsByClassName('test2').children[1].style.color = 'green';
</script>
</body>
</html>
Вопрос в том, что используя в качестве идентификатора айди элемента (В первом варианте test), мы спокойно можем редактировать свойства необходимого дочернего элемента, а есть ли такой же способ для редактирования дочернего элемента для всех указанных классов? P.S. Крайне желательно не использовать сторонние библиотеки, а силами самого JS. Заранее спасибо! |
666FoX666,
getElementsByClassName это список элементов, нужен индекс Цитата:
|
666FoX666,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.green {
color: #008000;
}
</style>
</head>
<body>
<div id="test">
<h1>First Child</h1>
<p>Last Child</p>
</div>
<div class="test2">
<h1>First Child #2</h1>
<p>Last Child #2</p>
</div>
<div class="test2">
<h1>First Child #2</h1>
<p>Last Child #2</p>
</div>
<script>
[].forEach.call( document.querySelectorAll('.test2'), function(el) {
el.querySelector('p').classList.add('green');
//el.children[1].style.color = 'green';
});
</script>
</body>
</html>
|
рони,
понял, большое спасибо! |
рони, скажу честно, Ваш цикл мне не очень понятен, но я погуглю и разберу его.
Сделал, видимо, крайне глупо (В консоль ошибку даёт), но тем не менее это работает. Вот о чём речь:
var cc = document.getElementsByClassName('test2');
for (var i = 0; i <= cc.length; i++) {
cc[i].lastElementChild.style.color = 'green';
}
|
...
|
Цитата:
Цитата:
|
Цитата:
|
| Часовой пояс GMT +3, время: 13:08. |