在不执行JavaScript或CSS的情况下加载JavaScript或CSS有哪些方法？

Question

我通过向页面的主体或正文添加<style>或<link>标记来了解动态脚本/ css加载,但是下载后它将由浏览器执行.我正在考虑其他下载方式但不执行javascript/css代码.首先,我想到的是XMLHttpRequest:

//simple execution received script
var executeScript = function(code){
    eval(code);
};
//create XMLHttpRequest in cross-browser manner
var xhr = createXMLHTTPObject();
//check whether file is loaded
var checkStatus = function(){
    if(xhr.readyState  == 4){
        if(xhr.status >= 200 && xhr.status < 300 || xhr == 304){
            executeScript(xhr.responseText);   
        }
        else {//error
        }
    }
};
//do request
xhr.open('get','http://podlipensky.com/examples/dynamicscript/hey.js', true);
xhr.onreadystatechange = checkStatus;
xhr.send(null);

但是在这种情况下,由于同源策略,我们受到来自同一域的脚本的限制(尽管我们可以尝试使用CORS解决它)

我想到的另一种方法是动态添加iframe到页面然后添加script标签iframe,所以脚本将在下载后执行,但它发生在另一个页面的上下文中 - iframe.

有没有其他方法可以下载而不是执行脚本？

更新:

下载但不执行javascript/css有用的原因之一是预加载第三方库,但仅在需要时使用它们.

Answer 1

您还可以使用iframe并使用 script/css URL 作为src框架（因此根本不会评估/应用它），尽管您需要确保在这种情况下 JavaScript/CSS 是随 Content 一起交付的- 键入text/plain以避免<角色等发生不幸的事情。尽管在一个不错的浏览器上，如果iframe src来自不同的来源，您也应该使用这种方法遇到 SOP 问题。

除此之外，我认为您列出的选项基本上已经涵盖了它。