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

К примеру есть десятки динамически создаваемых div блоков, в которых часто будут меняться данные.

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

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



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



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



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

1

var some_div = $('#div_1'

var something_in_div = someDiv.find('selector'

2

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



P.S. хранится данные будут в переменных класса, для каждого блока есть свой экземпляр

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

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

>> не забьётся ли память?
Для ответа на подобные вопросы используют тестирование приложений.
В отладчике браузера для этого сделана специальная вкладка которая строит кучи разнообразных отчетов рисует таймлайны, графики и диаграммы всех мыслимы показателей.

Переменная хранит ссыль на DOM объекты, поэтому можно через $() или document.getElementById(), или через делегирование $("#staticParent&#34.on("click", ".dynamicElement", function() { });

В переменных JavaScript ВСЕГДА хранятся ссылки. И в подпрограммы передаются ссылки. Никаких "весь объект целиком" в языке не существует.

Да, эффективнее хранить ссылки. Но для десятков блоков ты заметной разницы в производительности не увидишь.

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