Question

我需要更改innerHTML以将样式添加到PART OF文本中。但是，我注意到使用element.innerHTML =某些东西确实减慢了我的功能，特别是我有一个> 100的数组来改变。

那么在为innerHTML添加样式方面是否有更好的表现方式？

或者有没有办法在不使用innerHTML的情况下显示innerHTML等文本？

我的功能以防万一：

for (var i = 0; i < x.length; i++) {
        if(x[i].lastChild.className == "overlay"){
            //x[i].lastChild.innerHTML = x[i].lastChild.innerHTML.replace(/(<u>|<\/u>)/igm, "");

            if(!regexp.test(x[i].lastChild.innerHTML)){
                x[i].lastChild.style.opacity = 0;

            }else{
                x[i].lastChild.style.opacity = globalOpacityValue;

                //x[i].lastChild.innerHTML = x[i].lastChild.innerHTML.replace(/'">'+tempStore/,'"><u>'+tempStore+'</u>');

                if(x[i].lastChild.innerHTML=='<span style="color:'+textColor+'">' + tempStore + '</span>'){
                    x[i].lastChild.style.borderWidth = "thick";
                    x[i].lastChild.style.borderStyle = "solid";
                }

            }        
        }
    }

我很确定性能的降低来自innerHTML，因为它一旦我取消评论就会发生。

Answer 1

尝试不使用正则表达式替换，因为您要替换固定术语。例如，将您的第三行更新为：

x[i].lastChild.innerHTML = x[i].lastChild.innerHTML.replace("<u>", "").replace("</u>", "");

在此检查基准：https://jsperf.com/replace-string-vs-regex/6

element.innerHTML =表现不佳的东西，是否有更快的方式来改变innerHTML？

1 个答案: