Question

为什么加载dom时脚本标签在那里但它没有执行？假设我有这段代码

History.Adapter.bind(window, 'statechange', function(e) { // Note: We are using statechange instead of popstate
        var State = History.getState();
        $('#main-content').load(State.url + " #main-content");
    });

我将从给定的URL加载“#main-content”的内容。给定的URL和该URL包含此

<div id = "main-content">
<script>
$(document).ready(function(){
  console.log($('audio'));
})
</script>
</div>

为什么它没有在控制台中显示音频？

Answer 1

如http://api.jquery.com/load/所述，有几个原因导致以这种方式加载的脚本可能无法执行。

在这种情况下，您使用带后缀的选择器表达式仅将部分获取的内容插入到当前文档中。这样做的缺点是，在将内容的任何部分实际插入文档之前，将从内容中删除脚本。

在jQuery加载方法的源代码（v1.9.1）

中提到了排除脚本的原因

//如果指定了选择器，则在虚拟div中找到正确的元素

//排除脚本以避免IE'权限被拒绝'错误

如果可能的话，我会通过让服务器只响应“main-content”div来解决这个问题 - 可能是由你追加到初始URL的查询字符串触发 - 并在没有选择器的情况下加载它。

根据某些条件仅返回文档的一部分完全取决于生成文档的服务器端应用程序（如果有）。如果您 - 例如 - 正在使用PHP，请更改脚本以调用load(State.url + "?section=main-content")，然后让PHP检查$_GET['section']是否等于'main-content'。在这种情况下，跳过渲染除了要更新的div之外的所有内容。由于依赖于你在服务器上运行的，我无法就问题的这一部分给出更详细的答案。

如果您正在提供静态文件而且主机没有运行PHP或其他语言，我就是听到其他人建议首先将整个文档加载到iFrame中（#main-content调用中没有load()部分），然后使用纯JavaScript从主文档中提取要更新的部分。它可能适用于您的情况，但您的脚本很可能会执行两次。首先，加载文档的所有脚本部分都在iFrame的上下文中执行，然后提取的部分的脚本部分将在插入主文档后再次执行。

如果您正在提供静态文件，但主机确实运行PHP或其他语言，则可能可以编写一个小脚本来仅提取文档的部分你需要。这样的脚本可以基于PHP DOM and returning only part of document，但是被修改为从GET /查询参数获取XHTML文件的路径。这需要将加载调用更改为某些，例如load("path/to/extraction_script.php?filename=" + escape(State.url) + "&section=main-content")，以便将之前访问过的页面的完整路径发送到服务器。

注意：这样做可能会打开主要的安全漏洞，因为您实际上是在创建一个能够读取其有权访问的服务器上的任何文件的代理服务器，包括外部URL，除非您是非常小心。我不推荐这种方法，我无法测试它是否真的可以在实践中使用。这取决于您的服务器配置和文档的外观。

jQuery使用脚本标记

1 个答案: