Javascript jQuery/JSON内容数据加载

我是JS的初学者，所以。。。 我在寻找答案，但毫无结果

我有这个

$(document).ready( function() {
    $("#load_p1").on("click", function() {
        $("#content").load("p1.html");
    });
});

$(document).ready( function() {
    $("#load_p2").on("click", function() {
        $("#content").load("p2.html");
    });
});

$(document).ready( function() {
    $("#load_p3").on("click", function() {
        $("#content").load("p3.html");
    });
});

$(document).ready( function() {
    $("#load_p4").on("click", function() {
        $("#content").load("p4.html");
    });
});

我想知道是否有办法将所有这些数据保存在一个JSON或另一个文件中，而不是保存在4.html文件中

问题#2

这是控制视图的正确方法吗？或者这对严肃的网站管理员来说是不可接受的

---

对不起，我的英语很差：|

实际上，你的问题不是很清楚。但是，您可以将所有javascript内容放在一个文件中，比如：script.js，然后将脚本注入HTML文件（您需要在其中使用它）

方法允许加载html片段。您可以通过在要加载的url之后指定css选择器来实现这一点。当jQuery遇到该选择器时，它将在检索到的html中查找匹配的元素，并仅将该部分加载到元素中

例如，如果在html文件中

<div id="content1">
  content 1
</div>
<div id="content2">
  content 2
</div>
<div id="content3">
  content 3
</div>

它将只加载content2div

---

作为旁注，您不需要将每个

click（）

调用放入单独的

jQuery（document）中。ready（）

调用您可以将它们放入单个回调中。

OP希望将存储在

JSON

文件中的一些数据异步加载到他的页面中。为此，您需要用

html

替换

load

方法，并将

JSON

的适当部分作为参数传递

$("#load_p1").on("click", function() {
    $("#content").html(json[0]);
});

示例

JSON

结构

json = '[{"p1":"<h1>Test</h1>"},{"p2":"<h1>Test2</h1>"}]'

---

你到底想达到什么目的？您可以使用普通链接浏览“p1.html”到“p4.html”，是否有任何特定的理由尝试使用Javascript？我只想加载整个页面OK，答案是肯定的，当然您可以将所有内容放在一个JSON中。然后将该JSON加载到页面中，而不是使用

load

来使用

innerHTML

并将其传递给JSON对象的适当部分。我建议不要尝试将html放入JSON文件中，尽管这样做维护起来会很繁琐，如果html包含双引号字符，则需要转义，因为这样会破坏JSON语法，如果它们没有正确转义。但是我如何从文件（如sites.JSON）将数组传递给js您有几个选项，您可以在该项目中使用ES6或Require.js吗？是的Require.js似乎很好，我只想将内容从jquery平滑淡入容器div.smth，就像路由器一样，但在地址中没有路由

$("#load_p1").on("click", function() {
    $("#content").html(json[0]);
});

json = '[{"p1":"<h1>Test</h1>"},{"p2":"<h1>Test2</h1>"}]'

$.getJSON("test.json", function(json) {
    $("#load_p1").on("click", function() {
        $("#content").html(json[0]);
    });
});