Я предпочитаю привязывать все мои элементы DOM вверху моего кода, чтобы идентификатор или ссылка на класс кодировались только один раз, даже если этот элемент используется в коде несколько раз.Примерно так:
var startButton = "#startButton";
var closeButtons = ".button.close";
Это хорошо работает с селекторами, такими как document.querySelector.Проблема возникает, когда я собираюсь сравнить идентификатор элемента с одной из статических переменных выше, как, например, во время события щелчка:
e.target.id == startButton
Поскольку переменная startButton содержит резкое значение, мне придетсясделать что-то вроде этого:
e.target.id == startButton.replace('#', '')
Это, очевидно, не идеальный способ обработки вещей, поэтому мне интересно, есть ли лучший способ связать элементы DOM для последующего использования?
Пожалуйстаобратите внимание, что я рассмотрел возможность извлечения элементов с использованием селектора сразу, например, document.querySelector, но это не позволяет мне позже манипулировать элементами.
РЕДАКТИРОВАТЬ: Моя заметка выше оказываетсябыть неправым.Вполне возможно манипулировать элементами позже.Поэтому вопрос в том, лучше ли хранить селекторы в переменных или хранить узлы в переменных.Как указано ниже, элемент DOM может не существовать во время его объявления, поэтому может быть лучше сохранить селектор в переменной, как я делал выше.