Как выбрать элемент по data атрибуту на js?

Question

[Иван Соловьев]

Как выбрать элемент по data атрибуту на чистом js.
На jquery через $(); выбирает, но на js через querySelector не работает. Пишет:
Failed to execute 'querySelector' on 'Document': '.dropdown__content[data-content=6]' is not a valid selector.

var data_id = this.getAttribute('data-id');
var dropdown_content_ths = document.querySelector('.dropdown__content[data-content='+data_id+']');

Comments

[Kovalsky]

.dropdown__content[data-content=6] - это неправильный селектор. На чистом JS селекторы работают так же, как в CSS, следовательно вам для начала нужно прочитать как это делается в CSS.

[Иван Соловьев]

Спасибо. Пропустил кавычки.

Answer 1

[Егор Живагин]

var dropdown_content_ths = document.querySelector('.dropdown__content[data-content="'+data_id+'"]');

Comments

[Elena]

подскажите, а зачем тут плюсы +data_id+ ?

[Егор Живагин]

Elena, для конкатенации (склеивания) строки. В ES6 это делать чуть проще - `.dropdown__content[data-content="${data_id}"]`

Answer 2

[Антон]

кавычки двойные надо

Comments

[Григорий]

Зачем надо двойные кавычки?