Question

营销部门希望按国家/地区分开Google跟踪代码管理器。对于普通网站（而非SPA），我们可以根据URL轻松实现。客户将切换到另一个URL，然后刷新页面，在URL中添加国家代码，然后加载正确的GTM。

现在，对于SPA（在Angular中，Typescript），这要难一些。目前，我们在此应用程序中没有语言/国家/地区参数，但可以在整个Web应用程序中随时进行更改。当然，页面不会刷新。

我正在尝试找到一种动态加载和卸载GTM脚本的方法。

我可以成功加载和卸载<script>中的<head>元素，但是标记管理器添加了更多元素。

public loadScriptSimple(country : string) {
    //first remove existing node
    var existing = document.getElementById("tagmanager");
    if (existing && existing.parentNode) {
        existing.parentNode.removeChild(existing);
    }
    //
    console.log('adding node to head...');
    let node = document.createElement('script');
    if (country === "NL") {
        node.textContent =
            "(function (w, d, s, l, i) {w[l] = w[l] ....(window, document, 'script', 'dataLayer', 'GTM-XXX');";
    } else {//todo for later loading others
        node.textContent =
            "(function (w, d, s, l, i) {w[l] = w[l] ....(window, document, 'script', 'dataLayer', 'GTM-YYY');";
    }

    node.type = 'text/javascript';
    node.async = true;
    node.charset = 'utf-8';
    node.setAttribute("id", "tagmanager");
    document.getElementsByTagName('head')[0].appendChild(node);
    console.log('loaded script');
}

来源：https://stackoverflow.com/a/38473334/2901207

因此可以在第一个请求（例如，第一次基于IP确定国家/地区）上加载它，但是在更改国家/地区后，将加载两个标签。

有没有简单的方法可以删除现有元素，然后像上面一样创建新元素？

动态加载Google跟踪代码管理器并切换到SPA

0 个答案: