通过JavaScript/JQuery添加追踪代码：嵌入脚本标签可行吗？

首先，不能直接将<script async src='https://tag.simpli.fi/sifitag/#####-#####-#####'></script>这段标签代码直接写入点击事件函数中，原因和正确处理方式如下：

• 直接在JS函数里写HTML标签字符串，浏览器只会把它当作普通文本处理，不会解析并加载对应的脚本文件。
• 正确做法是在点击事件中动态创建script元素并插入页面，以此触发脚本的加载与执行：

$('body').on('click','.CLASS', function (e){
    // 先检查脚本是否已加载，避免重复请求
    const targetSrc = 'https://tag.simpli.fi/sifitag/#####-#####-####';
    if (!document.querySelector(`script[src="${targetSrc}"]`)) {
        const script = document.createElement('script');
        script.src = targetSrc;
        script.async = true;
        document.body.appendChild(script);
    }
    return true;
});

• 补充说明：如果该Simpli.fi脚本加载后需要手动调用方法触发追踪（类似LinkedIn的window.lintrk），可以监听脚本的load事件，在加载完成后执行对应逻辑：

$('body').on('click','.CLASS', function (e){
    const targetSrc = 'https://tag.simpli.fi/sifitag/#####-#####-####';
    const existingScript = document.querySelector(`script[src="${targetSrc}"]`);
    
    if (!existingScript) {
        const script = document.createElement('script');
        script.src = targetSrc;
        script.async = true;
        script.onload = function() {
            // 若脚本提供了手动触发的API，在此调用
            // 示例：window.sifitagTrack();
        };
        document.body.appendChild(script);
    } else {
        // 脚本已加载，直接调用触发方法（如果需要）
        // window.sifitagTrack();
    }
    return true;
});

部分第三方追踪脚本会在首次加载时自动完成追踪，这种情况动态插入脚本即可；若需手动触发，需参照脚本的官方文档调用对应API。

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