如何在GTM中通过自定义JavaScript变量提取相对点击数据及落地页头部内容

• 首先确认GTM内置变量配置：进入「变量」-「内置变量」管理页，勾选Click Element变量，后续需要通过该变量获取用户点击的按钮元素
• 新建自定义JavaScript变量，填入如下代码，代码中对应的选择器需要根据你的页面实际结构替换：

function() {
  // 获取触发点击事件的按钮元素
  const clickTarget = {{Click Element}};
  // 替换下方.section-container为你页面板块外层容器的CSS选择器
  const targetSection = clickTarget.closest('.section-container');
  if (!targetSection) return '';
  // 替换下方.section-header为你板块头部内容对应的CSS选择器
  const headerEl = targetSection.querySelector('.section-header');
  return headerEl ? headerEl.textContent.trim() : '';
}

• 触发规则配置：新建点击类型触发器，设置触发条件为「点击元素 - 匹配CSS选择器 - 你的「查看更多」按钮对应的CSS选择器」，仅在点击目标按钮时触发取值逻辑
• 验证方式：开启GTM预览模式，点击「查看更多」按钮后，在预览面板的变量列表中查看你新建的自定义JS变量是否返回了正确的头部内容

内容的提问来源于stack exchange，提问作者Mahmood_M