el elemento leído fue agregado a otro elemento contenedor div por el detector de eventos de envío. pero no puedo acceder al elemento de lectura cuando intento adjuntarlo a otro detector de eventos fuera de la función. ¿Algúna idea de cómo arreglar esto?
function add() { read = document.createElement('div'); read.textContent = 'Read'; read.classList.add('read'); card.appendChild(read); } submit.addEventListener('click', add); read.addEventListener("click", () => { read.classList.toggle('unread'); });Su código no es realmente correcto. Yo sugeriría:
let read = null; function add() { if (read) return; read = document.createElement('div'); read.textContent = 'Read'; read.classList.add('read'); card.appendChild(read); read.addEventListener("click", () => { read.classList.toggle('unread'); }); } submit.addEventListener('click', add);Aunque sin un contexto sobre lo que está tratando de lograr, será difícil.
Por cierto: no, las variables que se declaran dentro de una función tienen un alcance, no puede acceder a ellas desde el exterior
El eventListener del elemento de lectura no está activado, porque primero, si hace clic en el elemento de envío, el elemento de lectura es un elemento.
Solución:
function add() { read = document.createElement('div'); read.textContent = 'Read'; read.classList.add('read'); card.appendChild(read); read.addEventListener("click", () => { read.classList.toggle('unread'); }); } submit.addEventListener('click', add);