Jquery和Google跟踪代码管理器

时间:2015-11-17 10:56:47

标签: jquery google-tag-manager

我在网站上实施Google跟踪代码管理器时遇到一些问题。我有一个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在这里要做什么?我甚至没有在我的身体标签上声明它,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错误?

非常感谢任何类型的信息,我完全迷失了...... 祝你有愉快的一天!

3 个答案:

答案 0 :(得分:4)

我终于找到了解决方案,就像在另一个问题中所说的那样,jQuery是由googletagmanager注入的,它是由配置了google标记管理器的Web Agency配置的。

因此,如果您遇到同样的问题,请致电您的网络代理商......

如果您自己配置了代码管理器,请在Google跟踪代码管理器界面上检查您的设置。

答案 1 :(得分:3)

Google Tag Manager论坛上的Simo Ahava回答了这类问题:

Why jQuery might not be defined

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

即使您的页面确实加载了它,使用它的GTM标记也可能在页面加载jQuery之前被触发。

您可以让jQuery代码等待加载库,或者将其加载到自定义HTML标记中。

答案 2 :(得分:1)

就像之前所说的那样,GTM可能会在页面的jQuery加载之前加载。这意味着如果您在通过GTM注入的脚本中使用jQuery,它可能会生成“未捕获的ReferenceError:未定义jQuery”,具体取决于浏览器资源加载策略。

那就是说,你必须保证在 GTM脚本之前加载jQuery。您可以通过以下任一方式执行此操作:

  1. 控制脚本加载顺序
  2. 使用hack,例如使用setInterval循环直到jQUery可用:
  3. var func = function() {
        if (jQuery) {  
            clearInterval(timer);
            // do your stuff
        }
    }
    var timer = setInterval(func, 1000);