javascript - 複数のliのhtmlで文字列を検索します

Question

検索機能を追加しようとしている 1 ページの Web サイトがあります。純粋な javascript (jquery なし) を使用して、検索ボックスに入力された単語/フレーズを取得し、さまざまな li のコンテンツ/HTML を検索したいと考えています。innerHTML と .indexOf を組み合わせて使用​​する必要があると思いますが、よくわかりません。これは、私が参照しているサイトへのリンクですhttp://www.executiveinsurance.com/どんな助けでも大歓迎です!!!

Answer 1

まず、これに基づいて構築できます

function search()
{
    var lis = document.getElementsByTagName("li");
    var searchText = document.getElementById("searchBox").value;

    for(var i=0;i<lis.length;i++)
    {
        if(lis[i].innerHTML.indexOf(searchText) > -1)
           lis[i].style.color = 'red';
    }
}​

特定の単語を強調したいだけなら

lis[i].innerHTML = lis[i].innerHTML.replace(searchText,'<span style="color:red">'+searchText+'</span>');

ここで JsFiddle のデモを見る