Javascript 如何突出显示文档中键入到搜索框中的单词？

我在他们的网站上使用以下代码

<nav>
<div class="nav-wrapper">
  <form>
    <div center class="input-field">
      <input id="search" type="search" required>
      <label for="search"><i class="material-icons">search</i></label>
      <i class="material-icons">close</i>
    </div>
  </form>
</div>
</nav>

搜索
关闭

---

有没有办法在网站上搜索，并在用户键入单词时突出显示这些单词？

您可以使用hilitor.js进行搜索

HTML:

JS:

这是一本书

别忘了包括hilitor.js

---

下次提供更好的主题名称和标记，因为您的问题与materialize或materializecss无关。

您可以使用此库@makshh-这似乎工作得很好，下面是示例页面->因此您可以使用它：）有没有办法向下滚动到第一个突出显示的单词@makshhSorry，我不知道怎么做。

<nav>
  <div class="nav-wrapper">
    <form>
      <div center class="input-field">
        <input id="search" type="search" required placeholder="Search...">
        <label for="search"></label>
      </div>
    </form>
  </div>
</nav>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit praesentium ad placeat voluptates perspiciatis eaque odio non nisi impedit ea. Praesentium similique perferendis animi, cumque neque placeat deserunt facere ut. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit praesentium ad placeat voluptates perspiciatis eaque odio non nisi impedit ea. Praesentium similique perferendis animi, cumque neque placeat deserunt facere ut. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit praesentium ad placeat voluptates perspiciatis eaque odio non nisi impedit ea. Praesentium similique perferendis animi, cumque neque placeat deserunt facere ut.</p>

::-webkit-input-placeholder {
   color: #fff;
}
::-moz-placeholder {
   color: #fff;  
   opacity: 1;
}
:-ms-input-placeholder {  
   color: #fff;  
}
input {
  margin: 0;
}
p {
  margin: 0;
  padding: 15px 60px;
  background: #d66367;
  color: #fff;
}

var myHilitor2;

document.addEventListener("DOMContentLoaded", function() {
  myHilitor2 = new Hilitor("playground");
  myHilitor2.setMatchType("left");
}, false);

document.getElementById("search").addEventListener("keyup", function() {
  myHilitor2.apply(this.value);
}, false);