在DIV中显示XHTML的简单内容

Question

我想学习，我可以在一个DIV中显示一个XHTML文件内容，未使用的IFRAME。

这是我的测试：

index.xhtml

<html>
    <head>
        <title>jQuery Load</title>
        <script type='text/javascript' src="js/jquery-1.11.1.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $("#botton").click(function(event) {
                    $("#cap").load('test.xhtml');
                });
            });
        </script>
    </head>
    <body>
    <div id="cap">Click!!!.</div>
    <br>
    <input name="boton" id="botton" type="button" value="Update cap." />
    </body>
</html>

test.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>Content</title>
    </head>
    <body>
      <div id="content">Show content, YES.</div>
      <div id="hidden">I don't show</div>
    </body>
</html>

file:///??????/test.xhtml.错误控制台Chrome: XMLHttpRequest无法加载跨源请求仅支持协议方案: http、数据、铬扩展、https、铬扩展-资源。

谢谢大家！

Answer 1

这是因为您不是使用web服务器来服务您的文件，而是使用您的文件系统。您的url可能是file://.的file://index.html，当您尝试执行load(file)时，它将相对于当前的域(即load(file))

错误信息非常明显：CORS can only be used with these protocol : http, data, chrome-extension, https, chrome-extension-resource。

要么用http://file加载文件，要么使用for服务器进行测试。