JQuery 在渲染后搜索 dom 元素，并用其相应的值替换键

JQuery search dom elements just after rendering and replace keys by its corresponding values

本文关键字：替换 搜索 元素 dom JQuery      更新时间：2023-09-26

我正在尝试在正在开发的Web应用程序上应用自己的本地化方法。知道我正在使用JQuery 2.2.0，没有任何其他框架或第三方。我需要在我的纯 html 代码中编写一些表达式，以便：

ex-1:
<span>#{{lang.details}}</span>
ex-2:
<button value='#{{lang.save}}'>

然后，一旦 dom 完全渲染，我想遍历 dom 元素并找出所有这些以"#{{"开头并以"}}"结尾的表达式，以将它们替换为我的 JSON 包中的相应值。

我的 JSON 捆绑包如下所示：

var en = {
    details: "details",
    save: "save"
}

我的应用.js代码：

var lang = en;
// jquery load en json file
// search the dom elements and replace the key surrounded 
// by '#{{ }}' with its corresponding value from the bundle

在 JavaScript 或 JQuery 中找出这些元素的最佳方法是什么？我不能通过第三方有任何其他解决方案吗？

页面加载后用 JavaScript 变量替换 HTML

var doneReplacing = false;
$(function() {
    if (doneReplacing === false) {
        $(document.documentElement).html(function(index, content) {
            return content.replace(/#{{([^}]*)}}/g, function(match, $1) {
                return eval($1);
            });
        });
        doneReplacing = true;
    }
});

演示

正则表达式 101 已测试

基本上，它的作用是在页面加载后，搜索模式#{{ variable }}，然后将匹配项替换为变量的值。

相关文章：