如何使用javascript字符串对象

我在使用语言文件时遇到问题

目前，我有一个语言文件，其中有一个对象

var strings {
    title: "Title",
    subtitle: "Subtitle"
};

在我当前的html中，我将有如下内容

<div id="title">Title</div>
<div id="subtitle">Subtitle</div>

标题
字幕

现在我想在div中包含来自javascript对象的值，这样我就可以使用各种语言文件。相关的语言文件是由一个php脚本在后端选择的，这不是问题所在

乙二醇

strings.title
字符串。副标题

有没有一个简单的方法可以做到这一点？我不想每次都使用php来创建必要的js文件，也不想在创建时使用jquery循环来填充每个div值，尽管现在看来我必须这么做。”

---

谢谢

假设您有：

<script>
  var myJSVar = 'Hello, World!';
</script>

var myJSVar='你好，世界！'；

您可以直接输出它：

<script>
  document.write('<div>' + myJSVar + '</div>');
</script>

文件。写入（“”+myJSVar+“”）；

可以将其附着到BOM表：

<script>
  var div = document.createElement('div');
  div.innerHTML = myJSVar;
  document.getElementsByName('body')[0].appendChild(div);
</script>

var div=document.createElement（'div'）；
div.innerHTML=myJSVar；
document.getElementsByName（'body'）[0].appendChild（div）；

您可以根据ID填充div：

<div id="foo"></div>

<script>
  document.getElementById('foo').innerHTML = myJSVar;
</script>

document.getElementById（'foo'）.innerHTML=myJSVar；

或任何其他众多选项。这真的取决于你想要什么，尽管现在你很含糊。

HTML

<div id="title">strings.title</div>
<div id="subtitle">strings.subtitle</div>

---

这是您的代码

我认为您必须提供一个更完整的示例。如何存储不同的语言信息？如何将它们与HTML结合起来？如何知道哪个div必须包含哪个值？等等。在我看来，你想要一个支持i18n的模板引擎。@FelixKling谢谢，我更新了这个问题。我非常确定，如果可以避免的话，我不想要一个模板引擎。我真的不想使用document.write，我发布了这个问题，因为我想避免基于id填充div，或者尽可能地将其附加到BOM。我更新了我的问题，以便更好地解释我在寻找什么。我希望有一种函数可以让我在div标记中打印变量的值。对于（字符串中的var s）{var el=document.getElementById（s）；if（el）el.innerHTML=strings[s]；}如何？然后确保每个元素都有一个在

strings

对象中找到的属性ID。谢谢您的帮助。我最终使用类作为标识符，为包含我想要翻译的字符串的所有内容添加了一个额外的“translate”类。我也在考虑使用自定义的“translate”属性，但我听说我们不应该这样做。@saccharine：“自定义”属性可能不是一个好方法，不是。但是，您可以使用数据属性，如

data translate=“strings.title”

，并在jQuery中使用

.data（）

方法。谢谢您的提示。数据属性似乎非常有用。我想我要试一试。我应该如何使用.data方法？我想的更多的是具有某种属性的选择。我不知道如何使用.data（）进行翻译。谢谢您的帮助。最后我决定，最好的方法是在每个div中添加一个标识符，其中包含一个需要翻译的字符串，可以作为类或单独的属性，然后运行一个与您演示的类似的脚本。

<div id="title">strings.title</div>
<div id="subtitle">strings.subtitle</div>

// this is what you get from the language file
var LanguageStorage = {
  strings: {
    title: "Title",
    subtitle: "Subtitle"
  }
}


// function for replace language
function placeLanguageFor(selector) {
  var thiz = $(selector);
  var lidArray = thiz.text().split("\.");
  thiz.text(LanguageStorage[lidArray[0]][lidArray[1]]);
}

// show text based on language
placeLanguageFor("#title");
placeLanguageFor("#subtitle");