Хранение ссылок на элементы DOM

Question

В конкретном сценарии, который я пишу, у меня есть несколько объектов, которые связаны с некоторыми элементами DOM. Учитывая, что каждый элемент имеет уникальный идентификатор, должен ли каждый объект хранить только идентификатор элемента (и каждый раз использовать document.getElementById) или хранить элемент в свойстве?

Вот упрощенный пример того, что я имею в виду:

function myThing(elId) {
    this.elId = elId;
}
myThing.prototype.getElValue = function() {
    return document.getElementById(this.elId).nodeValue;
};

// -- vs -- //

function myThing(elId) {
    this.el = document.getElementById(elId);
}
mything.prototype.getElValue = function() {
    return this.el.nodeValue;
};

Имеет ли это какое-то значение? Есть ли какие-либо проблемы с производительностью, о которых я должен знать?

Answer 1

Я бы сохранил элемент; это имеет тенденцию делать код более понятным, когда вы не вызываете document.getElementById все время, и хотя в вашем случае вам может не потребоваться изменять идентификаторы или разрешать элементы без идентификаторов, это довольно распространенное желание сделать это.

(В отличие от apphacker, я не ожидал бы от этого огромного повышения эффективности, поскольку getElementById имеет тенденцию быть довольно хорошо оптимизированным в браузерах.)

Есть ли какие-либо проблемы с производительностью, о которых я должен знать?

Ссылки из объектов JavaScript на объекты DOM хороши сами по себе, но когда объект DOM имеет ссылку на такой объект JavaScript (обычно через обработчик событий), вы получаете цикл ссылок. Это приводит к утечке памяти в IE6-7, поскольку он не освобождает зацикленные объекты. Для небольших простых приложений вам может быть все равно. Для сложных, долго работающих приложений вам, возможно, придется обойти эту проблему, например, путем направления каждого обработчика событий через карту / массив поиска, чтобы не было прямой ссылки из объекта DOM на реальный обработчик событий.

Answer 2

Сохраните элемент, а не идентификатор, поиск медленный и дорогой, что избавит вас от вызова функции. Я думаю, что простой тест подтвердит это.