Javascript 来自tagmanager的Java脚本

我想确定是否通过从页面或通过标记管理器显式调用Java脚本来加载

以下代码可用于列出页面正在运行的Java脚本

$("script[src]").each(function( i, src ) 
{  
       console.info($(this).attr('src'));  
});

以下脚本是标记管理器的示例：

www.googletagmanager.com/gtm.js?id=GTM-TM2FVV7
d3c3cq33003psk.cloudfront.net/opentag-136914-2122355.js

我如何确定哪些脚本是由标记管理器服务带来的，哪些脚本是在页面中显式调用的

我考虑手动浏览HTML源代码，并注意显式调用了哪些脚本。但是，问题是如何知道哪个标记管理器调用了哪些脚本。

您可以使用这些脚本“侦听”DOM树中发生的更改。在本例中，您对添加到页面中的

节点感兴趣

以下是概念证明：

初始页面包含

，因此不应将其视为外部脚本

dropScript

函数模拟您的标签管理器：它将在您的页面上放置一个外部

，我们将跟踪它

每次DOM发生更改时，都会执行观察者回调。在本例中，我只对添加

元素感兴趣

1s后，我将目前检测到的所有外部脚本转储到控制台

constdropscript=（src）=>{
设置超时（（）=>{
document.body.appendChild(
document.createElement（'script'））
.src=src；
log（`dropped${src}在`）页上）；
}, 500);
};
常量externalScript=[]；
常量观察者=新的突变观察者（（突变）=>{
for（let突变的突变）{
突变.addedNodes.forEach（（节点）=>{
if（node.nodeName.toLowerCase（）=='script'）{
externalScript.push(
node.getAttribute（'src'）；
}
});
}
});
observer.observe（document.body，{childList:true}）；
dropScript（'http://example.com/external_1.js');
dropScript（'http://example.com/external_2.js');
dropScript（'http://example.com/external_3.js');
设置超时（（）=>{
console.log（externalScript）；
}, 1000);
我还尝试在标记管理器脚本上查看Chrome开发工具中网络选项卡上的预览代码。虽然代码中引用了一些.js文件，但很难看到发生了什么。一个脚本被带到它的指示，但不是结论。您可以使用
src
本身来识别它吗？我的意思是，如果标签包括
googletagmanager
。还有检查脚本时发现的垃圾，那就是脚本的最小化形式。大多数浏览器都有一个漂亮的打印按钮，这有点帮助。它的图标通常是两个花括号
{}
@David González不知道你所说的“你能用src本身来辨别”是什么意思。你能重新措辞吗？我想使用属性
src
。如果脚本来自
googletagmanager.com
，那么查看
src
是否包含该字符串（
$（this）.attr（'src'）.indexOf（'googletagmanager'）！=-1
）就很简单了。为此，您需要所有作为标记管理器的脚本都来自该域，而不是本地。