Как поднятся по DOM на одну ступеньку вверх и выбрать следующую ветку?
Есть такой хтмл код
<tw class="simpleCart_shelfItem"> <span class="item_nazvanie" itemprop="name"> <a class="tc-tiddlylink tc-tiddlylink-resolves" style="background-color: yellow;" href="#10010">Букет для любимой девушки ➨</a> </span> <input class="item_add" type="button" value="в корзину"> </tw> я по href могу выбрать блоки с <a class="tc-tiddlylink tc-tiddlylink-resolves" и поменять ему фон на желтый var matches = document.querySelectorAll('[href="'+'#'+ encodeURIComponent(item.name)+'"]'); for(var i = 0; i < matches.length; i++) { matches[i].style.backgroundColor = "yellow"; } но мне нужно поменять фон кнопки <input class="item_add" , которая находится под этой ссылкой, если подняться на один уровень через span . Как мне к этому блоку обратится? И еще вопрос как добавить с войство :after (:before) ? |
Цитата:
|
sovsem-nub,
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> tw.yellow a, tw.yellow .item_add{ background-color: #FFFF00; } tw.yellow:after { content: "добавлено"; } </style> <script> window.addEventListener('DOMContentLoaded', function() { var nodes = document.querySelectorAll('.simpleCart_shelfItem'), item = {name : 10010}; [].forEach.call( nodes, function(tw) { var a = tw.querySelector('[href="'+'#'+ encodeURIComponent(item.name)+'"]'); if(a){ tw.classList.add("yellow") } }); }); </script> </head> <body> <tw class="simpleCart_shelfItem"> <span class="item_nazvanie" itemprop="name"> <a class="tc-tiddlylink tc-tiddlylink-resolves" href="#10010">Букет для любимой девушки ➨</a> </span> <input class="item_add" type="button" value="в корзину"> </tw> </body> </html> |
Спасибо, Рони. А как все-таки повесить :after на input?
когда я поменял стиль на tw.yellow .item_add:after { content: "добавлено"; } слово "добавлено" пропало. может это потому, что у инпута тег не закрывается? на другие элементы нормально :after вешается... |
Цитата:
|
Цитата:
добавил код в демку своего js-интернет магазинчика http://novye-podarki.ru/heeg.html#Figures . Теперь, если щелкнуть на кнопочку "в корзину" появляется галочка на фотке товара. Если товар удалить из корзины, то галка исчезает :victory: |
Часовой пояс GMT +3, время: 23:31. |