En GTM, estoy tratando de devolver el texto interno de un elemento hermano del elemento en el que se hizo clic.
<div class="repair-item-n "> <div class="repair-slide--54894d33-6c88-488f-95d7-3ec9b6a3ade4"> <div class="restoration_wrap text-center"> <img class="restoration-image"> </div> <p class="title">Bags</p> </div> </div>Por ejemplo, al hacer clic en la clase "imagen de restauración", quiero devolver el valor "Bolsas".
Tengo múltiples apariciones de este HTML en la página con variantes como "Zapatos", "Sombreros", etc., así que quiero saber al hacer clic en cada uno, cuál sería el texto respectivo de la clase "título".
Prueba esto:
var images = document.querySelectorAll('.restoration-image'); images.forEach(function (image) { image.addEventListener('click', function (event) { var parent = this.parentNode; var nextSibling = parent.nextElementSibling; alert(nextSibling.innerText) }) });Esto debería funcionar para las variables JavaScript personalizadas de GTM.
function getImgTitle() { if({{event}} === 'gtm.click') { var image = {{Click Element}}; var parent = image.parentNode, nextSibling = parent.nextElementSibling; return nextSibling.innerText; } }Haría esto en una variable Javascript personalizada:
Click - Repair Item Title function() { var clickedEl = {{Click Element}}; if (!clickedEl) return; // Find the mutual parent element var repairItemEl = clickedEl.closest(".repair-item-n"); if (!repairItemEl) return; var titleEl = repairItemEl.querySelector(".title"); if (!titleEl) return; return titleEl.innerText }}