Estoy construyendo algunos elementos DOM en la página y quiero mantener una referencia a un elemento secundario en el elemento principal para actualizaciones posteriores.
for(i = 0; i < itemList.length; i++) { const item = $(`<div></div>`); item.addClass('List_Item'); item.title = $(`<div></div>`).addClass('List_Title'); item.append(item.title); $(item).init.prototype.getName = function() { return $(this).data('name'); } $(item).init.prototype.setName = function(name) { $(this).data('name', name); $(this).find('.List_Title').text(name); } item.setName(sources[i].name); }
¿Cómo puedo evitar usar .find()
de esta manera para capturar el elemento secundario con un selector y, en su lugar, mantener una referencia en el item
elemento en sí?
Editar:
He optado por una función guardada en una tienda .data()
item.data('name', sources[i].name); var getName = function() { return item.data('name'); } var setName = function(name) { item.data('name', name); title.text(name); } item.data('setName', setName);
Luego puedo acceder a esto externamente más tarde así
$('.List_Item').each(function(index, item) { if($(item).data('name') == prevName) { var setName = $(item).data('setName'); setName(newName); } });