Question

我在使用jQuery，CSS，HTML而没有服务器端的HTML页面（模板）上工作，我遇到了问题我想用我的计算机替换另一个HTML页面<div>。

在主页面上我有这段代码：

<nav>
    <h2 class="hidden">Our navigation</h2>
    <ul>
        <li><a onclick="nextpage(1);">Home</a></li>
        <li><a onclick="nextpage(2);>Contact</a></li>
    </ul>
</nav>
<div id="pageContent">
        Hello motto
        </div>

和JavaScript块是这样的：

function nextpage(idd){
$.get( "pages/page1.html", function( data ) {
  $("pageContent").html(data);
});

}

当我按“主页”按钮时，必须使用我网站的根地址中的HTML代码替换pageContent的内容：../../pages/page1.html。

我尝试实施这些示例并且没有任何好结果：

我想在不使用服务器端API的情况下替换DIV。

谢谢！

Answer 1

您错过了#的id选择器：

$("#pageContent").html(data);

除此之外，您可以使用.load()方法，因为您可以将特定div作为目标加载在页面中，您可以执行此操作：

$("#pageContent").load('pages/page1.html #divid2load');
// will load the #divid2load div from the html page.

Answer 2

该文件需要放在Web服务器上然后执行。出于安全原因，浏览器通常不允许使用file：///协议进行AJAX调用。请在此处查看您的错误error:XMLHttpRequest cannot load file

当您询问服务器时，我没有自己的经验，但阅读相关信息，请使用chrome.exe --allow-file-access-from-files More Explanation Here

运行您的Chrome实例

希望这有助于..........

将<div>替换为另一个HTML页面</div>

2 个答案: