查询 Datalayer 以及如何在 CustomHTML 中运行

Question

我有下面的 javascript 代码，我从 HTML 元素中提取目标 URL 和 Alt 属性并尝试将值推送到数据层中。

我已经使用控制台测试了代码，它得到了所需的值。我主要关心的是我们如何推送数据层中的值。我是否需要修改代码才能通过 GTM 在 customHTML 中运行？

var divHead= document.getElementsByClassName('card__media-overlapping__media');
var eventhandlerdoc = function(event){
    var imgURL=event.currentTarget.firstElementChild;
    var imgALT=event.currentTarget.firstElementChild.firstElementChild.getAttribute('alt');

dataLayer = [];
     dataLayer.push({
            'expImgurl': imgURL,
            'expImgalt': imgALT

}

for(var index=0; index < divHead.length; index++){

divHead[index].addEventListener('click',eventhandlerdoc,true);}

Answer 1

如果在 GTM sn-p 之后执行您的代码原样将破坏 GTM（因为 GTM 使用自定义代码修改了 dataLayer 的 push 方法并添加了几个事件）。因此，您需要确保在 sn-p 之前执行此操作，或者检查 dataLayer 是否已初始化并重用它：

window.dataLayer = window.dataLayer || [];

此外，这些变量只有在将下一个事件推送到 dataLayer 后才可用，因此您需要推送自定义事件或等到下一个 (GTM) 事件后再使用它们。

由于 GTM 有自己的点击处理程序，我建议您使用它并移动 javascript 代码以将属性检索到自定义 javascript 变量。