如何在 javascript 中搜索句子中的单词

Question

我这里有这个html代码：

<p id = "str">How much wood could a wood chip chop</p>
<br>
<input type = "text" value = "" id = "txt1"/>
<button onclick = "myFunction()"> Search </button>

<p id="demo">Display the result here.</p>

和这里的 JavaScript 代码：

function myFunction()
{
  var myString = document.getElementById("str").innerHTML;
  var myWord = document.getElementById("txt1").value;
  var myPattern = new RegExp('.'+myWord,'g');

  var myResult = myString.split(" ");

  for(var i=0; i<myResult.length; i++) {
    var result = myResult[i].match(myPattern);
    if(result) break;
  }

  document.getElementById("demo").innerHTML = myResult;

}

现在我想做的是：

1. 当用户输入时，woo它将wood与找到的结果数一起输出，例如 - 2 results found。

2. 当用户输入时，od它还会wood与找到的结果数一起输出，例如 - 2 results found。

3. 与ch- 相同，输出应该是chip, chop- 2 results found。

4. 并且op- 输出应该是chop- 1 result found。

Answer 1

切勿从 HTML 属性调用函数onclick，而应使用事件。请参考这个SO问题。我已用 jQueryclick函数替换了此调用 - 如果您愿意，可以使用普通 JS 方法。

你的代码几乎可以工作了。您可以简单地使用 RegExpmatch方法来查找字符串中出现的次数。您不需要手动执行此操作。

这段代码对我有用：

var myString = document.getElementById("str").innerHTML;
var myWord = document.getElementById("txt1").value;
var myPattern = new RegExp('(\\w*'+myWord+'\\w*)','gi');

var matches = myString.match(myPattern);

if (matches === null)
{
    document.getElementById("demo").innerHTML = "No results"; // Any message or empty
    return;
}

document.getElementById("demo").innerHTML = matches + " - " +  matches.length + " result(s) found.";

这是正在运行的JSFiddle 演示。