jQuery和Google Tag Manager

Question

jQuery和Google Tag Manager

11

我在我的网站上实现Google Tag Manager时遇到了一些问题。我有一个Google代码，但当我尝试将其放到我的网站上时，它会产生很多JavaScript冲突。

因此，我尝试将该代码放在单独的文件中，以便逐步操作并观察不同脚本的行为。

这是我的非常简单的HTML页面：

<!DOCTYPE html>
<html>
<head>
    <title>Titre</title>
</head>
<body>
    <!-- Google Tag Manager -->
    <noscript>
    <iframe src="http://www.googletagmanager.com/ns.html?id=GTM-XXXXXX" height="0" width="0" style="display:none;visibility:hidden"></iframe>
    </noscript>
    <script type="text/javascript">
        dataLayer = [{'uid':'12'}];
        (function(w,d,s,l,i){
            w[l]=w[l]||[];
            w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});
            var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';
            j.async=true;
            j.src='//www.googletagmanager.com/gtm.js?id='+i+dl;
            f.parentNode.insertBefore(j,f);
        })(window,document,'script','dataLayer','GTM-XXXXXX');
    </script>
    <!-- End Google Tag Manager -->
    hello
</body>
</html>

而且这个页面在JS控制台中返回错误：

Uncaught ReferenceError: jQuery is not defined

这是意料之外的，jQuery 在这里有什么作用？我甚至没有在 body 标签中声明它，难道 Google 要求使用 jQuery 吗？

所以这很奇怪，第二件事是，当我查看生成的 HTML 页面，在浏览器加载后：

<body>
... Long stuff here
<script type="text/javascript" id="" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
... some other stuff here
</body>

这是什么神奇的操作？为什么Google会在我的页面底部添加一个jQuery的东西，并且我的控制台会显示一个jQuery错误？

非常感谢提供任何信息，我完全迷失了......祝你有美好的一天！

- Hammerbot

3个回答

5

在Google Tag Manager论坛上，Simo Ahava回答了这类问题：

为什么jQuery可能未定义

基本上，他说GTM默认不加载jQuery。

即使您的页面加载了它，使用它的GTM标签也可能在jQuery页面加载之前触发。

您可以让您的jQuery代码等待库被加载或在自定义HTML标记中加载它。

- Aaron

2

就像之前所说的那样，GTM可能会在页面的jQuery加载之前加载。这意味着，如果您在通过GTM注入的脚本中使用jQuery，它可能会根据浏览器资源加载策略生成“Uncaught ReferenceError: jQuery未定义”的错误。

也就是说，您必须确保jQuery在GTM脚本之前加载。您可以通过以下两种方式之一实现：

1. 控制脚本加载的顺序 2. 使用hack技巧，例如使用setInterval循环，直到jQUery可用：

var func = function() {
    if (jQuery) {  
        clearInterval(timer);
        // do your stuff
    }
}
var timer = setInterval(func, 1000);

- Anoyz

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Hammerbot · Accepted Answer

我终于找到了解决方案，就像其他问题中所说的那样，jQuery是由googletagmanager注入的，并且是由配置google标记管理器的Web Agency进行配置的。

因此，如果您遇到相同的问题，请联系您的Web Agency...

如果您自己配置了标记管理器，请在Google标记管理器界面上检查设置。