如何检查哪个Javascript文件插入哪些代码？

Question

如何检查哪个Javascript文件在页面上插入了哪个代码？

我正在尝试查找哪个JS文件在this page.上插入了此JSON-LD代码段

代码开始如下：

[{"@context":"http://schema.org","@type":"Hotel","@id":"https://www.etstur.com/Granada-Luxury-Belek","name":"Granada Luxury Belek","image":"https://cdn.imageets.com/resize/a3e5181d58534ad7/230/230/files/images/hotelImages/TR/95763/l/Granada-Luxury-Belek-Genel-257544.jpg","priceRange":"En uygun fiyatlar ve 6 taksit avantajıyla","address":[{"@type":"PostalAddress","addressLocality":"Belek","addressCountry":"","streetAddress":"Belek","postalCode":""}],"telephone":"444 0 387","aggregateRating":{"@type":"AggregateRating","bestRating":10,"ratingValue":9.3,"worstRating":1,"reviewCount":""}}

例如，Google的结构化数据测试工具会告诉我，哪个JS文件插入了这样的特定JSON-LD代码。 https://i.imgur.com/S5mc9ev.png

Answer 1

在一般情况下，调试时，一种选择是在页面加载的开始处添加DOMSubtreeModified侦听器（每次将元素添加到DOM时，即使页面正在加载，该监听器都会运行），找到您感兴趣的元素时抛出错误，并检查堆栈跟踪以查看插入了什么：

const callback = () => {
  if (document.querySelector('script[type="application/ld+json"]')) {
    window.removeEventListener('DOMSubtreeModified', callback);
    throw new Error();
  }
};
window.addEventListener('DOMSubtreeModified', callback);

此可行，但是不建议使用同步突变侦听器，并且不应在生产代码中使用它们，而应仅将它们用于调试。

在您的网站上，由于GTM script，它似乎已插入：