使用GTM/JQuery获取手风琴h3标题返回undefined的解决求助

错误根因 #

你当前代码返回undefined的核心原因是：{{Click Element}} 是GTM返回的原生DOM元素，不支持jQuery的find()、text()方法，直接调用会报错导致返回空值。

修复后的GTM自定义变量代码 #

直接使用原生JS实现，无需依赖jQuery，兼容性更强：

function(){
    // 定位到当前点击元素所属的手风琴父容器
    const accordionContainer = {{Click Element}}.closest('.paragraph--type--services-child-accordion');
    if(!accordionContainer) return '';
    // 从父容器内查找h3标签
    const targetH3 = accordionContainer.querySelector('h3');
    // 返回h3的文本内容，做空值兼容
    return targetH3 ? targetH3.textContent.trim() : '';
}

逻辑说明 #

无论点击的是div.accordion-tab容器本身、内部h3标签、箭头图标还是空白区域，closest方法都会向上查找到共同的父容器.paragraph--type--services-child-accordion，再从父容器内精准查找唯一的h3元素获取文本，不会受点击位置影响。

如果你一定要使用jQuery实现，需要确保jQuery在GTM触发前已加载完成，代码调整为：

function(){
    var title = $({{Click Element}}).closest('.paragraph--type--services-child-accordion').find('h3').text();
    return title.trim();
}

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