Войти

Показать полную графическую версию : Получение элемента по атрибуту data-*


kosmonavtom
22-08-2019, 19:31
Здравствуйте.
Вот нашел и собрал вот такой код с ошибками (ошибки в строке с: elem = document.querySelector("div[data-reactid=sr]"); видимо не так что-то пишу)


<script>
function chpok(sr){
elem = document.querySelector("div[data-reactid=sr]"); //находим блок div и значение атрибута data-reactid
state = elem.style.display; //смотрим, включен ли сейчас элемент
if (state =='') elem.style.display='none'; //если включен, то выключаем
else elem.style.display=''; //иначе - включаем
}
</script>


Он должен работать (т.е. отображать блоки div или скрывать при нажатии на кнопки) для тегов HTML вида:


<button onclick="chpok('.1.$0')">
Вопрос 1
</button>
<div data-reactid='.1.$0' style="display:none">
Это выводится первый вопрос?
</div>
<button onclick="chpok('.1.$1')">
Вопрос 2
</button>
<div data-reactid='.1.$1' style="display:none">
Тут выводится второй вопрос.
</div>


Если везде заменить "data-reactid" на "id", и ошибочную строку на строку elem = document.getElementById(id); то все работает, но проблема в том, что в тегах на сайте нет и не будет аттрибута id. Подскажите пожалуйста можно ли получить элемент по значению атрибутов "data-reactid" - они уникальны для каждого объекта на странице тега div. И что тогда нужно сделать? Заранее спасибо за любой ответ.

Serguei Kouzmine
22-08-2019, 23:55
поставьте @ в аргумент чтоб с указанным аттрибутом искать

div[@data-reactid]

Sham
23-08-2019, 19:38
потому что sr в строке - это просто sr. "div[data-reactid=\"" + sr +"\"]" либо шаблонная строка (https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/template_strings)`div[data-reactid="${sr}"]`




© OSzone.net 2001-2012