Javascript 当使用各种脚本注入带有Google Chrome扩展的HTML模板时，jQuery不会'；似乎不重要

为了详细说明，我正在我的Google Chrome扩展中注入并加载一个HTML模板，如下所示：

    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
        // Typical action to be performed when the document is ready:
            
            var PBSKPage = xhttp.responseText;
            document.querySelector('html').innerHTML = "";
            loadPBSKPage();
            function loadPBSKPage() {
                
                document.querySelector('html').innerHTML = PBSKPage;
            }
        }
    };
function insertAndExecute() {
    var scripts = Array.prototype.slice.call(document.getElementsByTagName("script"));
    for (var i = 0; i < scripts.length; i++) {
        if (scripts[i].src != "") {
            var tag = document.createElement("script");
            tag.src = scripts[i].src;
            document.getElementsByTagName("head")[0].appendChild(tag);
        }
        else {
            eval(scripts[i].innerHTML);
        }
    }
}

var xhttp=new-XMLHttpRequest（）；
xhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
//文件准备就绪时要执行的典型操作：
var PBSKPage=xhttp.responseText；
document.querySelector（'html'）。innerHTML=“”；
loadPBSKPage（）；
函数loadPBSKPage（）{
document.querySelector（'html'）。innerHTML=PBSKPage；
}
}
};
函数insertAndExecute（）{
var scripts=Array.prototype.slice.call（document.getElementsByTagName（“脚本”）；
对于（var i=0；i

在我的HTML模板中，我明确地将请求jQuery的脚本标记放在依赖jQuery的脚本之前：

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="chrome-extension://niabfndainielhgpcjenbpodannhfofj/2015/pbsk_resources/wildkratts/js/vendor/jquery-1.11.0.min.js"><\/script>')</script>
        <script src="chrome-extension://niabfndainielhgpcjenbpodannhfofj/2015/pbsk_resources/wildkratts/js/vendor/jquery.nivo.slider.pack.js" type="text/javascript"></script>
        <script src="chrome-extension://niabfndainielhgpcjenbpodannhfofj/2015/pbsk_resources/wildkratts/js/vendor/jquery.touchSwipe.min.js" type="text/javascript"></script>
        <script src="chrome-extension://niabfndainielhgpcjenbpodannhfofj/2015/pbsk_resources/wildkratts/js/vendor/retina.min.js"></script>
...

window.jQuery | | document.write（“”）
...

jQuery似乎不导入，当执行JS文件时，浏览器总是在导入jQuery时定义的内容上抛出一个未捕获的TypeError

---

那我该怎么办？这是因为CSP吗？是因为insertAndExecute（）函数吗？这是因为谷歌Chrome扩展的内在工作机制吗？我想我可以将jqueryjs粘贴到每个依赖jQuery的JS文件中，但这不是很有效。有人对此有解决方案吗？

是的，这是CSP的一个问题，因为chrome不希望人们链接外部库并在以后恶意更改它们。您可以获取jQuery库并将其显式添加到项目中，但这需要更多的工作：（

我没有足够高的代表对我上面的答案发表评论，但是将jQuery与您的代码和您希望使用的库捆绑在一起应该可以做到这一点。也就是说，使用一个更新版本的jQuery可能是一个好主意，因为自1.11版以来，它收到了许多重要的安全补丁。

我认为它也是一个好主意可以更改CSP，使其按您拥有的方式工作，但我不记得怎么做。基本上，我只需复制整个jQuery库代码，然后将其粘贴到需要的JS文件中即可。@TheFiguy是的，您可以这样做，或者最好将其作为一个单独的文件，并在html中将其链接到

，其中位置/名称是jQuery库的相对位置所以只要把这个；

放到HTML中就行了？你说的“jQuery库的相对位置”是什么意思？在此处下载jQuery：并将其移动到您的项目中。然后将jQuery js文件相对于html文件的放置位置放在这里。唯一的解决方案是将jQuery粘贴到需要它的js文件中？奇怪的是，每当我转到html模板本身时，它都会很好地执行脚本，没有错误，但是每当我转到live p被HTML模板（pbskids.org/wildkratts/）覆盖的age在执行时有问题。