Javascript:替换字符串函数在 IE7-8 中不起作用

Question

我创建了一个 JSFiddle 来显示我的程序:

http://jsfiddle.net/8Fx3a/10/

正如您将看到的，当用户在输入字段中键入内容并单击“开始”时，程序将尝试在链接列表中查找该值并以黄色突出显示该单词(通过在该单词周围添加一个 span 元素并给它一个“亮点”类别)。

如果用户检查另一个单词，则现有的跨度将全部删除，并放置新的跨度。

正是这个removeSpan函数在IE7-8中不起作用。它将成功突出显示相关单词，但如果用户输入另一个值，它不会删除现有的范围。

有谁知道这里可能出现什么问题吗？

Answer 1

几点:

将 regExp 从 /^\s+/ 更改为 /^\s+|\s+$/g 可能很有用，因为它也会 trim 尾随空格。

将 if (text_input === "") { 更改为 if (removeSpaces === "") { 否则，如果您只输入空格，您会得到可怕的结果.

当您只在一处调用函数 highlight、removeSpan 和 addSpan 时，为什么要声明它们？只需将它们的代码放在您调用它们的地方(当然，除非您也想在其他地方使用它们)。

为什么要创建临时变量 newstr 和 newstr2？只需将 anchor_text.replace() 调用的结果重新分配回 anchor_text 即可。

在替换函数中传递正则表达式而不是字符串。

实现所有这些更改，我们得到:

document.getElementById('check-list').onclick = function() {

    text_input = document.search.search_list.value.replace(/^\s+|\s+$/g, "");

    if (text_input.length) {

        var anchor = document.getElementById('results').getElementsByTagName('a');
        var alength = anchor.length;

        for (var x = 0; x < alength; x++) {
            var anchor_text = anchor[x].innerHTML;

            anchor_text = anchor_text
                .replace(/<span class="highlight">/gi, "")
                    .replace(/<\/span>/gi, "");

            anchor[x].innerHTML = anchor_text;

            var re = new RegExp(text_input, "gi");

            if (anchor_text.search(re) !== -1) {
                anchor_text = anchor_text.replace(re, "<span class='highlight'>$&</span>");
                anchor[x].innerHTML = anchor_text;
            }
        }
    }
}