Question

我试图用shebang实现AJAX - 意味着example.com/#!/somepage.php只是example.com/somepage.php加载到AJAX网站的内容区域。

这样做的显而易见的方法是只请求somepage.php，然后用新文档替换documentElement的全部内容。然而，这似乎有点打败了AJAX的目的。

相反，我考虑尝试加载somepage.php，然后提取页面的content部分，然后将其放在内容区域中。

要做到这一点，我可以使用正则表达式来查找/<div id="content">.*</div>/但这是一个非常糟糕的主意（最简单的问题是＆＃34; </div>结束内容？）。相反，我希望能够执行ajaxresponse.getElementById('content')之类的操作，但我如何将ajaxresponse转换为document（或documentFragment）对象？

或者这只是实现这种AJAX设置的错误方法？让服务器端检查X-Requested-With: XMLHttpRequest并仅发送回内容区域会更好吗？

Answer 1

不要逐字地请求#!'d页，而是请求与您的#!处理程序兼容的变体。

这种方法需要两个步骤。

通过JSON公开您的内容页面。使此服务可用于满足特定条件的请求，例如特殊的get参数，扩展名，标头等。例如，/somepage.php?json可能在JSON中提供/somepage.php的内容。
编写#!处理程序，以便在处理请求时，它会调用您在上面为该页面定义的服务。例如，当加载example.com/#!/somepage.php并处理somepage.php时，请改为请求somepage.php?json，并根据需要传播该请求的内容。

这种方法可以带来许多好处。

缩小AJAX请求的响应大小
减少服务器端负载，因为不需要呈现HTML
避免HTML解析和一些昂贵的DOM操作
不依赖浏览器发送适当的AJAX相关标头

Answer 2

请注意，您实际上不需要使用正则表达式来从返回的数据中获取内容。例如，使用jQuery，只需使用$ selector（live fiddle）的context参数

$.get("/", {}, function(data){
    $("#text").append($("#login", data));
});

另请注意，shebang导航通常与某些Javascript框架相关联

将AJAX响应作为文档处理？

2 个答案: