jQuery根据JSON列表更改页面内容和哈希

jquery changing page content and the hash according to a json list

本文关键字：哈希 根据 JSON 列表 jQuery      更新时间：2023-09-26

我想将（使用 ajax）资产从外部文件加载到容器div 中。

  "pages": {
    "page1": {
      "html": "markup/page1.html",
      "css": "style/css/pages/page1.css",
      "js": "scripts/pages/page1.js"
    },
    "page2": {
      "html": "markup/page2.html",
      "css": "style/css/page2.css",
      "js": "scripts/page2.js"
    },
  }

基本上，这是一个美化的幻灯片放映，用户可以单击下一步并转到下一张幻灯片/页面。但是我正在努力加载每个元素和关联的资产，以及使用 jquery 更改哈希。

提前感谢您的帮助

首先，让 html 直接包含 css 和 js 文件，这样你只需要处理一个文件。

其次，您可以...

将 iframe 用于容器div 并加载它 

$("#container").attr('src', url);

使用 ajax 调用来获取内容，并将其放在div 中，如下所示......

$.ajax({
        type: "GET",
        url: url,
        dataType: "html",
        success: function(html) {
            $("#container").html(html);
        },
        error:function (xhr, ajaxOptions, thrownError){
                    alert("Failed to load page!'n" + xhr.status + "'n" + thrownError);
        }
    });

如果您的所有 css 和 js 文件都预先加载，则使用第二个选项会更好，但如果您单独加载它们并担心它们可能会冲突，iframe 将是更安全的方法，因为我认为更改div HTML 不会卸载不再需要的任何 css 或 js 文件。

相关文章：