Правильное оформление стилей в js

Question

Как более правильно менять стили в js,

Напрямую (1способ) или через поиск в документе (2способ) ?

Как будет грамотней?

main.style.backgroundColor = 'blue';    // 1 cпособ
document.querySelector("#main").style.backgroundColor = 'blue';  // 2 способ

<div id="main">
Опа
</div>

Answer 1

2-ой способ использовать лучше. Первый же способ лучше не использовать. Это поведение соответствует стандарту, но поддерживается в основном для совместимости, как осколок далёкого прошлого. Браузер пытается помочь нам, смешивая пространства имён JS и DOM. Это удобно для простых скриптов, которые находятся прямо в HTML, но, вообще говоря, не очень хорошо. Возможны конфликты имён. Кроме того, при чтении JS-кода, не видя HTML, непонятно, откуда берётся переменная.

Вы можете сделать так если вам будет удобнее

const main = document.getElementById('main')
main.style.backgroundColor = 'blue';

<div id="main">
        Опа
        </div>

БЛОГ НА HUSL

Правильное оформление стилей в js

Ответы (1 шт):