用于加载代码的AJAX

几天前，我遇到了Polymer项目和Web组件。据说这是网络的未来。我对此不甚了解。但如果我理解得很好，这个想法就是增强网页代码的模块性。在这方面，我想问一个简单的问题。用于加载代码的AJAX

是否有任何缺点或反对使用AJAX来读取一个假定的“纯文本”文件（但与HTML，CSS和JS），并使用“document.write”JavaScript函数插入到不同的代码文件？我想知道这一点，因为这似乎以一种非常简单快捷的方式解决了网页代码模块化问题。这样做有什么问题吗？

谢谢！

来源

2014-09-29 Blasfemizer

是的，有更好的选择'document.write'。设置元素的innerHTML或使用服务器打印纯文本可能会更好。但是您面临CSRF和XSS的问题。 – 2014-09-29 13:28:13

是没有问题的这样做，除了文件撰写的页面加载后不会工作，但它是常见的用法做这样的事情在运行时加载脚本：

function addScript(anUrl) { 
    var aScript = document.createElement('script'); 
    aScript.type = 'text/javascript'; 
    aScript.src = anUrl; 
    $("head").append(aScript); 
}

浏览器会照顾加载和运行从URL的脚本，所以你不需要手动插入源，但如果需要，你可以做到这一点的方法：使用

function addScriptSource(sourceText) { 
    var aScript = document.createElement('script'); 
    aScript.type = 'text/javascript'; 
    aScript.textContent = sourceText; 
    $("head").append(aScript); 
}

来源

2014-09-29 13:26:17 FrancescoMM

好的，谢谢你的回答！ – Blasfemizer 2014-09-29 13:41:52

总的原则是好的，但肯定document.write是可怕的。文档完全解析后无法安全使用document.write。因此，在异步加载资源之后使用它是不安全的。

更好的方法是创建一个DOM节点，将获取的资源加载到节点中，然后将该节点加载到DOM中。例如，异步加载脚本（但一般原则也可概括为其他资源）：

var xhr = new XMLHttpRequest(); 
xhr.open("GET", "somescript.js"); 
xhr.send(); 

xhr.addEventListener("load", function(e) { 
    var fetchedScriptContent = e.target.responseText 

    var s = document.createElement("script"); 
    s.textContent = fetchedScriptContent; 
    // s.innerText = fetchedScriptContent; // for older browsers 
    document.body.appendChild(s); 
});

来源

2014-09-29 13:30:22 apsillers

好的，谢谢你的回答！ – Blasfemizer 2014-09-29 13:37:14

用于加载代码的AJAX

回答

相关问题