时间戳

首页 > 解决方案 > Javascript使用while循环查找和替换函数

javascript - Javascript使用while循环查找和替换函数

问题描述

我有这个简单的功能来查找和替换我的 textarea消息中的文本。用户将能够在文本区域中键入内容，也能够从他们刚刚输入的文本区域中查找和替换单词。目前我正在尝试使用while循环来替换用户键入的文本区域中的多个相同单词。但是每次我运行它时，它似乎都会冻结整个html页面，知道为什么会这样吗？

查找和替换是用户键入他们想要查找和替换的单词的文本框，用户也可以键入多个单词进行替换。

function findText() {
  let find = document.getElementById('find').value;
  let replace = document.getElementById('replace').value;
  let message = document.getElementById('message').value;
  var lmao = message.indexOf(find);

  while (message.indexOf(find) != -1) {
    document.getElementById("message").value = message.replace(find, replace);
  }
}

标签： javascripthtml

解决方案

将while循环替换为replaceAll.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replaceAll

function findText() {

  let find = document.getElementById('find').value;
  let replace = document.getElementById('replace').value;
  let message = document.getElementById('message').value;
  var lmao = message.indexOf(find);

  document.getElementById("message").value = message.replaceAll(find, replace);

}
<div>Find <input id="find" value="find" /></div>
<div>Replace <input id="replace" value="replace" /></div>
<div>
  <textarea id="message" style="height: 100px">you can find and replace every words just by .replaceAll, example: find 1 find 2 find 3</textarea>
</div>
<div>
  <button onclick="findText()">Submit</button>
</div>

推荐阅读