欢迎访问我的博客,有问题可以在任意文章底部留言评论

通过GTM往页面注入JS做Push event

事件跟踪 Haran 10年前 (2016-08-08) 7627次浏览 2个评论
文章目录[隐藏]

不建议使用这种方式

这一节要介绍一种“理论上可行,但实务上不推荐”的事件跟踪方法。

如果你掌握了这套方法,在某些简单场景下确实可以完全不依赖开发人员,只通过Google Tag Manager(GTM)完成事件埋点。但前提是:

⚠️ 你需要具备一定的JavaScript基础

⚠️ 并且清楚GTM中标签的加载顺序与执行时机

下面先介绍它的原理和实现方式,再解释为什么不建议在正式环境中使用。

实现原理说明

这种方式的核心思路是:通过GTM 的「自定义 HTML」标签注入一段JavaScript,在页面加载早期,用JS定位DOM元素,给目标元素动态添加属性(如data- 属性或 class),再通过GTM的点击触发器,基于这些新增属性来触发事件,事件触发后,将数据发送到 GA4

从结果上看,相当于:你通过GTM,“间接修改了页面HTML结构”,从而让原本无法直接追踪的元素,变得“可追踪”

 

示例说明:跟踪「关于作者」点击事件

假设页面中有一个「关于作者」的链接或按钮:
通过GTM往页面注入JS做Push event

Step 1:使用自定义HTML注入JS

在GTM中新建一个自定义 HTML标签,写入一段 JavaScript,定位位置,添加属性即可
通过GTM往页面注入JS做Push event为了确保后续的点击事件能正确触发,这个自定义 HTML标签必须满足两个条件:

  • 优先级要足够高:在 GTM 中将该标签的触发顺序设为靠前
  • 必须在基础跟踪代码之前或至少同时加载完成:否则,点击行为可能发生时,属性还没被注入

所以代码要设置优先级更高些,然后是在基础跟踪代码加载之前就要加载好。

 

Step 2:验证代码

查看页面元素验证代码是否添加上去:
通过GTM往页面注入JS做Push event

 

这种方式能做什么?

从技术角度看,这种方式适用于所有跟踪,而且全部在GTM完成。

 

但为什么「不建议使用」?

  • 强依赖执行顺序,极不稳定:这种方式高度依赖JavaScript的执行时机,顺序
  • 页面结构变动,埋点直接失效
  • 调试与维护成本极高
  • 可读性差,不利于团队协作:当容器里出现大量「自定义 HTML + DOM 注入」时,就不好维护

 

结论

原则上,这种方法几乎可以应用于所有事件跟踪,但从稳定性、可维护性和长期成本来看,不建议使用

 

拓展阅读:


有疑问可以在底部留言
喜欢 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(2)个小伙伴在吐槽
  1. 博主你好我想统计adsense的点击能用吗
    GMTtt2018-10-20 18:56 回复 Linux | Chrome 37.0.0.0
    • 事件跟踪
      GA小站2018-10-21 15:34 回复 Mac OS X | Chrome 69.0.3497.100