替换< div>与另一个HTML页面 [英] Replace <div> with another HTML page

问题描述

我正在使用jQuery，CSS，HTML而不在服务器端使用HTML页面(模板). <div>以及我计算机上的另一个HTML页面.

I'm working on an HTML page (a template) using jQuery, CSS, HTML without server-side and I have a problem when I want to do to replace a <div> with another HTML page from my computer.

在主页上我有以下代码:

On the main page i have this code:

<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块是这样的:

and JavaScript block is this:

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

}

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

When I push "Home" button then must replace content of pageContent with the HTML code from my website-s root address: ../../pages/page1.html.

我尝试实现这些示例，但取得了很好的效果:

I tried to implement these examples and withour any good result:

• 将当前的html页面替换为Ajax响应
• 如何使用以下方法获取html页面的源代码jQuery
• jQuery.get()

• Replace current html page with ajax response
• How to get source code of html page using jquery
• jQuery.get()

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

I want to replace a DIV without using Server-Side API's.

谢谢！

推荐答案

您错过了# ID选择器:

You misssed the # for id selector:

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

---

除此之外，您可以使用.load()方法，因为您可以将特定的div定位到页面中，所以可以这样做:

---

Other than this you can use .load() method for it, because you can target specific div to load in your page you can do this:

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

这篇关于替换< div>与另一个HTML页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！