每次加载页面时加载不同的 js 文件答案

【问题标题】：Load a different js file with every load of the page每次加载页面时加载不同的 js 文件
【发布时间】：2014-04-28 13:23:12
【问题描述】：

所以基本上我有一个 JS 文件，其中包含 objects(var)，并且我希望能够在每次加载页面时加载不同的 Object。例如，当页面加载时，会创建一个新的对象“temp”，其中包含来自 JS 文件的一些对象 data*（data1、data2 等）的数据。我不知道它是如何工作的，也不知道我是否需要 5 个 .js 文件或一个包含 5 个数据变量的文件。

    var data = {

    'coords' : [[784, 42], [802, 324], [128, 365], [710, 166], [513, 283], [610 , 391], [544, 48], [323, 204], [316, 50], [938, 52]],
    'walkthrough' : [8, 6, 0, 9, 3, 1, 5, 4, 2, 7],
    'highscore' : 2217  
}

var data1 = {
    'coords' : [[784, 42], [933, 211], [304, 190], [756, 264], [365, 395], [129, 302], [504, 261], [650, 393], [283, 26], [593, 35]],
    'walkthrough' : [8, 9, 0, 1, 3, 7, 6, 4, 5, 2],
    'highscore' : 2123

}

var data2 = {
    'coords' : [[784, 42], [591, 289], [242, 289], [710, 150], [465, 371], [589, 146], [667, 24], [323, 204], [173, 173], [898, 197] ],
    'walkthrough' : [8, 2, 7, 4, 1, 5, 3, 9, 0, 6],
    'highscore' : 1897

}

var data3 = {
    'coords' : [[785, 264], [591, 289], [392, 49], [419, 332], [862, 159], [533, 166], [710, 119], [323, 204], [600, 32], [834, 54]],
    'walkthrough' : [2, 7, 3, 1, 0, 4, 9, 6, 8, 5],
    'highscore' : 1573

}

var data4 = {
    'coords' : [[903, 292], [634, 352], [44, 350], [150, 188], [883, 131], [475, 240], [697, 152], [274, 341], [491, 69], [784, 34]],
    'walkthrough' : [2, 7, 5, 1, 0, 4, 9, 6, 8, 3],
    'highscore' : 2167

}

我想要的是有一个对象'temp'，它将包含来自某些数据对象的数据。

任何帮助表示赞赏，提前致谢。

【问题讨论】：

是否可以将所有对象放在一个数组中？如果是，请执行 Math.random 并让它选择一个索引！
我在下面给出了答案（实际上这几乎是@A1rPun 所说的 - 抱歉，没看到！）数据是静态的，还是来自某个地方？可能有更好的方法来解决这个问题。
存储这么小的数据不需要5个js文件，存一个文件，然后用Math.random()函数随机选择一个变量。
"需要 5 个 .js 文件还是一个包含 5 个数据变量的文件？" - 这取决于“每次加载不同的对象”的实际含义。如果不同的文件用于不同的用户，则单独存储数据以节省流量（每个用户将只下载他需要的内容）。相反，如果每个用户最终都需要下载所有数据（例如在浏览您的网站后），则将其存储在一个文件中，并防止用户必须单独下载所有文件。
它是静态数据，实际上并没有那么多内容，所以从每个用户下载几kB应该不是问题。感谢您的建议。 Archer 的解决方案非常合适。

标签： javascript jquery ajax

【解决方案1】：

这应该可以满足您的需求...

var data = [{
    'coords' : [[784, 42], [802, 324], [128, 365], [710, 166], [513, 283], [610 , 391], [544, 48], [323, 204], [316, 50], [938, 52]],
    'walkthrough' : [8, 6, 0, 9, 3, 1, 5, 4, 2, 7],
    'highscore' : 2217  
}, {
    'coords' : [[784, 42], [933, 211], [304, 190], [756, 264], [365, 395], [129, 302], [504, 261], [650, 393], [283, 26], [593, 35]],
    'walkthrough' : [8, 9, 0, 1, 3, 7, 6, 4, 5, 2],
    'highscore' : 2123

}, {
    'coords' : [[784, 42], [591, 289], [242, 289], [710, 150], [465, 371], [589, 146], [667, 24], [323, 204], [173, 173], [898, 197] ],
    'walkthrough' : [8, 2, 7, 4, 1, 5, 3, 9, 0, 6],
    'highscore' : 1897

}, {
    'coords' : [[785, 264], [591, 289], [392, 49], [419, 332], [862, 159], [533, 166], [710, 119], [323, 204], [600, 32], [834, 54]],
    'walkthrough' : [2, 7, 3, 1, 0, 4, 9, 6, 8, 5],
    'highscore' : 1573

}, {
    'coords' : [[903, 292], [634, 352], [44, 350], [150, 188], [883, 131], [475, 240], [697, 152], [274, 341], [491, 69], [784, 34]],
    'walkthrough' : [2, 7, 5, 1, 0, 4, 9, 6, 8, 3],
    'highscore' : 2167
}];

var thisData = data[Math.floor(data.length * Math.random())];

将所有数据存储在一个数组中，然后随机选择其中一个。这是一种比拥有多个 js 文件更好的方法，因为您只需维护一个文件。

【讨论】：

哈哈@A1rPun。非常模因。所以lulz。
@GameAlchemist 我同意有更好的方法来做到这一点。我已经在问题 cmets 中向 OP 询问了数据的情况。我不喜欢在 js 文件中包含这么多数据的想法，除非这是唯一的方法。它一定来自某个地方。
当然。服务器上的 JSON 文件 + 客户端上的 XMLHTTPRequest 来读取它们似乎非常适合这种情况。
不幸的是，JSON 在某个时候不合适，我前段时间排除了它的可能性……我不记得为什么了……但是 Archer 的解决方案确实很合适。