Вопрос Как более оптимизированно ссылаться на dom элементы?

Регистрация
28 Фев 2013
Сообщения
69
Репутация
0
Спасибо
0
Монет
0
К примеру есть десятки динамически создаваемых div блоков, в которых часто будут меняться данные.

Данные могут быть совершенно разные, data атрибуты, текст внутри внутренних span и т.д.

Используется Jquery.



Что будет более рациональным, каждый раз использовать поиск элемента по id, классам или сохранять объекты в переменных через $("#selector") и потом ссылаться на них?



Казалось бы очевидно лучше хранить в переменных, но что в этом случае хранит переменная, ссылку на dom элемент или весь объект целиком? не забьётся ли память?



Какие варианты я вижу:

1

var some_div = $('#div_1');

var something_in_div = someDiv.find('selector');

2

каждый раз обращаться через $('#div_1'); и более подробные селекторы, по типу $('#div_1 selector')



P.S. хранится данные будут в переменных класса, для каждого блока есть свой экземпляр
 
>>Как более оптимизированно ссылаться на dom элементы?
Перестать экономить на спичках. Это всегда является глупым и контррациональным поведением.

>>...сохранять объекты в переменных через $("#selector") и потом ссылаться на них?
Jquery делает это автоматом (изучи в отладчике $.cache )

>> не забьётся ли память?
Для ответа на подобные вопросы используют тестирование приложений.
В отладчике браузера для этого сделана специальная вкладка которая строит кучи разнообразных отчетов рисует таймлайны, графики и диаграммы всех мыслимы показателей.
 
Переменная хранит ссыль на DOM объекты, поэтому можно через $() или document.getElementById(), или через делегирование $("#staticParent").on("click", ".dynamicElement", function() { });
 
В переменных JavaScript ВСЕГДА хранятся ссылки. И в подпрограммы передаются ссылки. Никаких "весь объект целиком" в языке не существует.

Да, эффективнее хранить ссылки. Но для десятков блоков ты заметной разницы в производительности не увидишь.
 
Если ты переживаешь за оптимизацию, то зачем jQuery в принципе используешь?
DOM элементы в память не копируются. В переменной хранится ссылка.
Чтобы элементы каждый раз не искать, можно использовать document.getElementsByTagName() или document.getElementsByClassName() которые возвращают живую HTML коллекцию, раз уж они у тебя добавляются динамически.
Или следи за свойством children в отслеживаемом div.
 
Назад
Сверху