Javascript 从web存储加载带有HTML的页面

我正在测试一个使用本地存储的应用程序的概念，需要知道存储内容后加载内容的最佳方式

从本质上讲，应用程序将预取内容，在本地存储，然后根据请求将其发送到新页面。我需要用户能够单击链接（mysite.com/article1.html），而不是让浏览器对页面发出HTTP请求，只需加载本地存储的html即可

那么，我如何加载“localNews”值，而不是为同一个页面创建HTTP呢

var storeUrl;
var localNews;

$('a').click(function() {
event.preventDefault();
storeUrl = $(this).attr('href');
$.ajax({
    url: storeUrl,
    cache: true,
    crossDomain: true
}).done(function(html) {
    localNews = html;
    console.log(localNews);
    localStorage.setItem('storeUrl', 'localNews');
});
});

---

所以基本上你想通过Ajax加载一个本地文件？可以这样做，但只需对Ajax调用进行一些小的调整。因此，改变这一点：

$.ajax({
    url: storeUrl,
    cache: true,
    crossDomain: true

为此：

$.ajax({
    url: storeUrl,
    cache: true,
    crossDomain: true,
    async: false,
    dataType: 'html',
    contentType: 'text/html;charset=utf-8'

---

注意

async

和

datatype

和

contentType

。我编写此代码已经有一段时间了，但我相信关键参数是

async

，但也需要

datatype

和

contentType

。

我认为此链接可能会阻止您重新创建现有的内容：您在$（'a'）中忘记了事件。单击（函数（事件）{@dystroy如果我错了，请纠正我，但如果我们使用PHP模板引擎，这将不起作用。我可以看到您的做法，但我的问题更多的是如何加载您添加的if语句中的实际内容。您可以将其附加到正文中，或加载到iframe中

$.ajax({
    url: storeUrl,
    cache: true,
    crossDomain: true,
    async: false,
    dataType: 'html',
    contentType: 'text/html;charset=utf-8'