使用JSON文件中的值为页面上的元素分配

Question

我有一个多语言Web应用程序，我希望将所有文本存储在JSON文件中，并为每个页面上的每个元素加载每个文本。例如：

$("h1.text1").append(data[language]['startpage'][0]['text1']);

Tjis将根据语言在h1.text1中显示不同的文字。

目前我给每个元素一个唯一的类，例如h1.text1，并在JSON中通过该类调用它们，例如。文字：“标题”。然后我像上面的例子一样用JQuery分配它们。只是想知道是否有更好的方法来做到这一点？因为我将在每个页面的每个元素中分配许多代码行？

Answer 1

我可能会这样做的方法是使用数据标签：

<div data-translate="myTranslateIdHere"></div>

然后你可以让你的json数据包含data-translate id。这在javascript中会很简单。您可以迭代json数组，并使用data-translate id查找元素，并设置该元素的文本。如下所示：

$(myJSON).each(function(key, val) {
    $("[data-translate='" + val["translateId"] + "']").text(val["translateValue"]);
});

然后，您只需要更新您的JSON以获得具有translateId映射到translateValue的正确结构。显然你还需要修改上面的JavaScript来适应你的JSON，这只是一个简单的想法。