2017-07-15 104 views
2

在使用javascript加载js脚本之前,是否可以重写html页面中所有脚本标记的所有src?在页面加载之前修改html页面中所有脚本的src

我试图使用<plaintext>标签,但我想知道是否有更好的解决方案。

+0

有什么用呢?如果你首先执行你的JavaScript,你可以通过一个MutationObserver来监听所有脚本节点,并在读取它们时对它们进行编辑。 –

+0

你想防止加载所有脚本? –

+0

我想通过代理加载它们 –

回答

2

我想我做了一个你想要的工作例子。它使用MutationObserver监听节点对主体的更改,并在找到时更改所有脚本的src。它要求您的JavaScript在目标文件之前执行。

<script> 
 
    // select the target node 
 
    var target = document.body; 
 

 
    // create an observer instance 
 
    var observer = new MutationObserver(function(mutations) { 
 
    mutations.forEach(function(mutation) { 
 
     console.log(mutation.type) 
 
     Array.from(document.querySelectorAll('script')).forEach(s => { 
 
     if (s.src && s.src.indexOf('jquery') !== -1) { 
 
      s.src = "" // this resets the script src 
 
     } 
 
     }); 
 

 
     console.log('Jquery is loaded:', typeof $ !== 'undefined') 
 
    }); 
 
    }); 
 

 
    // configuration of the observer: 
 
    var config = { 
 
    childList: true 
 
    }; 
 

 
    // pass in the target node, as well as the observer options 
 
    observer.observe(target, config); 
 
</script> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js?hej"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js?oj"></script>

+0

我不明白。根据文档,https://developer.mozilla.org/en/docs/Web/API/MutationObserver事件在dom被更改后触发,因此它开始从原始src下载脚本,我无法阻止它。 –

+0

@GiuseppePes我认为相同,但在我的例子中,它似乎阻止了脚本的执行。直到我测试它之前,我都不确定它会如何工作。 –

+0

如果您查看网络控制台发出的请求,脚本会被提取,但看起来它不会执行它。 –