为什么 replace(） 会破坏 onclick(）

Why is replace() disrupting onclick()?

本文关键字：onclick 为什么 replace      更新时间：2023-09-26

我正在使用替换在我的动态加载的网页中搜索此符号 Æ 并将其替换为 ® .我在这个问题中找到了这样做的代码：使用 JS 查找和替换文档中的特定文本字符

    $("body").children().each(function () {
            $(this).html( $(this).html().replace(/Æ/g,"®") );
    });

但是，在我添加此代码后，此函数停止工作。

    document.getElementById("backToClasses").onclick = function() {
        console.log("Clicked");
    };

谁能告诉我为什么会发生这种情况？

在第二个代码块(我假设它首先运行(中，您将在 DOM 中找到一个元素并为它的属性赋值。

第一块代码遍历 DOM 并将其中的大块转换为 HTML 源代码，然后修改该源代码，然后从中生成新的 DOM 元素并用它们替换之前的任何内容。

因此，ID为backToClasses的元素：

  1. 获取单击处理程序
  2. 转换为 HTML
  3. 被摧毁
  4. 被从其旧 HTML 创建的新版本所取代

单击处理程序仅在 DOM 上出现，因此新元素没有它。

如果要采用此方法，则应考虑仅循环文档中的文本节点并处理文本而不是HTML。为此，您需要递归循环 DOM 并测试每个元素的节点类型。

不过，最好解决您正在破解的潜在问题。几乎可以肯定，这是由于某处错误指定的字符编码。

W3C 提供了一些关于字符编码的材料，可能会有所帮助。

通过这样做：

$("body").children().each(function () {
        $(this).html( $(this).html().replace(/Æ/g,"®") );
});

重新创建所有HTML元素，因此之前可能已绑定的任何事件都将丢失。不要使用 .html() 函数替换文本。而且，我不确定这是替换角色的最佳方式。

此替换应在服务器端完成，而不是在客户端完成。通过在客户端(在JavaScript中(执行此操作，您可能会遇到不同的问题，例如SEO(Google使用编码错误的字符索引您的网站(。如果文件中的字符是这样的，只需替换该文件中的字符，确保使用正确的编码保存文件。

相关文章：