Форум

Jostorl · #1 (**permalink**) 09.06.2017, 11:31

Привет всем. Народ, помогите скриптик запилить. На интернет магазине я отчищаю кнопку "В корзину" от лишних тегов вот так:

document.querySelector('.to-cart').innerHTML = 'В корзину';

Кнопка имеет класс 'to-cart'.

Но в списке товаров где этих кнопок много этот скрипт, понятное дело, обрабатывает только первую кнопку.

Как пройтись по всем элементам и изменить каждый из них?

Предположим что HTML такого вида:

<div class="greateparant">

<div class="parant">
<div class="child">
<div class="to-cart"></div>
</div>
</div>

<div class="parant">
<div class="child">
<div class="to-cart"></div>
</div>
</div>

<div class="parant">
<div class="child">
<div class="to-cart"></div>
</div>
</div>

</div>

Как мне обратиться к каждому диву с классом "to-cart" ?

ksa · #2 (**permalink**) 09.06.2017, 14:04

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

Как пройтись по всем элементам и изменить каждый из них?

Использовать

document.querySelectorAll('.to-cart')

Ну и циклы...

Jostorl · #3 (**permalink**) 09.06.2017, 14:07

Я не шарю в javascript так хорошо. Покажите полный код, пожалуйста

j0hnik · #4 (**permalink**) 09.06.2017, 14:09

Если вдруг не понял КСА

<html>
<head>
	<meta charset="utf-8">
</head>
<body>
	<div class="greateparant">
		<div class="parant">
			<div class="child">
				<div class="to-cart"></div>
			</div>
		</div>
		<div class="parant">
			<div class="child">
				<div class="to-cart"></div>
			</div>
		</div>
		<div class="parant">
			<div class="child">
				<div class="to-cart"></div>
			</div>
		</div>
	</div>
	<script>
		[].forEach.call(document.querySelectorAll('.to-cart'), function(el) { 
			el.innerHTML = 'В корзину'
		});
	</script>
</body>
</html>

Jostorl · #5 (**permalink**) 09.06.2017, 14:38

Спасибо, работает

Форум

Справочник

Discord чат

Курсы javascript