javascript - 使用 javascript 更改完整的 HTML 内容(不扭曲 CSS/Img 文件)

Question

我正在尝试使用 JavaScript 更改网页的可见 HTML 文本。

代码:

function changeHTMLContent() {
    var server_url = "http://127.0.0.1:8000";
    var oldHTML = document.documentElement.innerHTML;

    $.post(server_url + "/changeHTMLDoc/",
    { input_html: oldHTML,},
    function(response) {
        var resp = JSON.stringify(response);
        resp = resp.substring(1, resp.length - 1);

        var jObj = JSON.parse(resp);
        var oldText = jObj.oldText;
        var newText = jObj.newText;

        alert(newText);
        var newHTML = document.documentElement.innerHTML;
        for (var i = 0; i < oldText.length; i++) {
            newHTML = newHTML.replace(/oldText[i]/g, newText[i]);
        }
        alert(newHTML);
        document.documentElement.innerHTML = newHTML;
    });
}

alert(newText) 显示正确的文本更改(这是所需的)。 alert(newHTML) 与 OldHTML 相同。 (虽然它应该从 for 循环中改变，但它似乎不起作用。)

更新:

newHTML = newHTML.replace(new RegExp(oldText[i],"g"), newText[i]);

在 for 循环中使用了它，它用 newText 更改了 oldText，但是 html 页面的 css/img 会因此扭曲。 (所有 css/img 文件都位于项目的 static 文件夹内。)

有人可以建议如何解决吗？ 谢谢，

Answer 1

该行有错误

newHTML = newHTML.replace(/oldText[i]/g, newText[i]);

您正在寻找用另一个文本完全替换“oldTexti”。

如果你想替换数组oldText中的字符串，你必须每次创建一个正则表达式

newHTML = newHTML.replace(new RegExp(oldText[i],"g"), newText[i]);

• /oldText[i]/g 是:查找类似于 "oldTexti" 的字符串 全局
• new RegExp(oldText[i],"g") 是:在数组中查找字符串 oldText 位于全局 (g) 中的索引 i