Xandr24
@Xandr24
учиться и еще раз учиться

В чем разница между querySelector и getElementById?

Доброй ночи, сори что вопрос простой, но вот для понимания решил задать. Я вижу различие только в наименование и в #
В чем их разница, как это "различие" может вылиться на деле?

<p id="time">12-48</p>
var time = document.getElementById("time");
time.innerHTML = "уже не время";


var time = document.querySelector("#time");
time.innerHTML = "уже не время";
  • Вопрос задан
  • 10214 просмотров
Решения вопроса 2
andreylc
@andreylc
html, css, js, java
Тоже долго вкуривал про querySelector.
Вот как его легко понять:
К примеру, у тебя есть каскад из блоков или несколько блоков с одинаковым классом.

<ul>
  <li>Elem</li>
  <li>Elem</li>
  <li>Elem</li>
  <li>Elem</li>
</ul>


С помощью querySelector ты можешь добраться например до 2 или 3 элемента по css селектору, не добавляя лишних классов в HTML
Вот так
var a = document.querySelector('ul > li:nth-child(3)'); // берем 3 элемент li в списке ul. 
a.classList.add('active');  // добавляем класс active 3 элементу

Запись повторяет точь в точь как в css

ul > li:nth-child(3) {
  color: red;
}
Ответ написан
@karminski
Senior React.JS Developer
Вы не правы. querySelector позволяет найти элементы по ЛЮБОМУ допустимому селектору (как в CSS), а не только по ID.

Вообще, если бы чуть-чуть потрудились поискать, вы бы нашли вот это
https://learn.javascript.ru/searching-elements-dom
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы