在谷歌标签管理器,跟踪这个标记
<div class="swiper-button-prev-recom" tabindex="0" role="button" aria-label="Previous slide" aria-controls="swiper-wrapper-29c7f9f933787763" aria-disabled="false">
<svg width="8" height="13" viewBox="0 0 8 13" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.261501 5.64373C-0.087168 5.9924 -0.087168 6.57352 0.261501 6.92218L5.53027 12.1909C5.91767 12.5784 6.49879 12.5784 6.84746 12.1909L7.7385 11.3386C8.08717 10.9512 8.08717 10.3701 7.7385 10.0215L3.98063 6.26359L7.7385 2.54446C8.08717 2.19579 8.08717 1.61468 7.7385 1.22727L6.84746 0.374968C6.49879 -0.0124407 5.91768 -0.0124408 5.53027 0.374968L0.261501 5.64373Z" fill="#757575"></path>
</svg>
</div>
使用触发器:
“Click Element Matches CSS Selector .swiper-button-prev-recom svg”
工作正常
但试图追踪:
<div class="swiper-button-next-recom" tabindex="0" role="button" aria-label="Next slide" aria-controls="swiper-wrapper-29c7f9f933787763" aria-disabled="false">
<svg width="8" height="13" viewBox="0 0 8 13" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.7385 6.92218C8.08717 6.57352 8.08717 5.9924 7.7385 5.64373L2.46973 0.374968C2.08232 -0.0124408 1.50121 -0.0124407 1.15254 0.374968L0.261501 1.22727C-0.0871676 1.61468 -0.0871675 2.19579 0.261501 2.54446L4.01937 6.30233L0.261501 10.0215C-0.0871672 10.3701 -0.0871671 10.9512 0.261501 11.3386L1.15254 12.1909C1.50121 12.5784 2.08232 12.5784 2.46973 12.1909L7.7385 6.92218Z" fill="#757575"></path>
</svg>
</div>
有:
“Click Element Matches CSS selector .swiper-button-next-recom svg”
不起作用。为什么不呢?
我问chatGPT,它是这样说的:
触发器“Click Element Matches CSS selector .swiper-button-next-recom svg”应该可以跟踪下一个箭头上的点击,假设CSS选择器或触发器的配置没有问题。
以下是它可能不起作用的几个可能原因:
选择子特异性:确保CSS selector .swiper-button-next-recom svg准确匹配标记中的下一个箭头元素。仔细检查类名,确保没有拼写错误或多余的空格。也有可能存在冲突的CSS样式或影响元素的JavaScript修改,从而阻止触发器触发。您可以在浏览器的开发人员工具中检查元素,以验证选择器是否正确地指向下一个箭头。
触发顺序:验证下一个箭头的触发器在Google Tag Manager中的位置是否正确。如果有多个触发器匹配同一个click事件,则触发器的顺序很重要。确保下一支箭的扳机放在可能干扰其发射的任何其他扳机之前。
事件传播:如果有事件侦听器或JavaScript代码附加到下一个箭头元素,阻止单击事件传播到文档,则触发器可能不会激发。如果有自定义事件处理程序或JavaScript框架拦截单击事件,则可能发生这种情况。在这种情况下,您可能需要使用自定义JavaScript代码来手动跟踪单击事件。
要解决此问题,您可以:
验证CSS选择器:使用浏览器的开发工具检查下一个箭头元素,并确认CSS选择器。swiper-button-next-recom svg准确地定位它。
测试触发器:创建一个带有不同条件的测试触发器,例如“Click Element - matches CSS selector - .swiper-button-next-recom”,以查看它是否正确捕获了click事件。如果是这样,则可能是原始触发器中使用的CSS选择器有问题。
检查JavaScript冲突:暂时删除可能干扰单击事件的任何自定义JavaScript代码或第三方脚本。然后,测试触发器是否正确触发。如果是这样,则逐渐重新引入JavaScript代码以识别任何冲突。
通过检查CSS选择器、触发器顺序和潜在的JavaScript冲突,您应该能够解决问题并成功跟踪下一个箭头上的单击。
做document.querySelectorAll('.swiper-button-prev-recom svg')
给出了正确的元素。
Click Element with CSS selector is not working in Google Tag Manager
我觉得答案里的信息没什么用。
你怎么让箭一直射下去?
1条答案
按热度按时间0md85ypi1#
Click Element
精确地引用所选元素。如果你点击一个子元素,例如一个内联span
在一个链接内,它将被处理,而不是链接。将触发器从
Click Element
更改为Click Class
应该可以防止这种行为。示例Click元素,CSS选择器
div > svg
:单击SVG并意外选择了
div > svg > path
。现在path
是您的Click Element
,div > svg
的触发器将不会触发。示例Click类,CSS选择器
div > svg
:单击SVG并意外选择
div > svg > path
。然而,svg
被处理为Click Class
,因为path
是选择器作用域的子作用域。