javascript实现页面搜索功能

时间比较紧，所以没有太多时间。我就废话少说，这一篇主要是javascript实现页面查找功能。

代码如下：

 

<script type="text/javascript" language="javascript">
    //获取要查找字符串
    function findIt()
    {
        if (document.getElementById("txtSearch").value != "")
            findInPage(document.getElementById("txtSearch").value);
    }

    var NS4 = (document.layers) ? 1 : 0;
    var DOM = (document.getElementById) ? 1 : 0;
    if(document.all)
    {
        DOM = 0;
    }
    var win = window;
    var n = 0;

    function findInPage(str) {
        var txt, i, found;
        //判断查找的内容是否为空
        if (str == "") {
            return false;
        }
        if (DOM) {
            win.find(str, false, true);
            return true;
        }
        if (NS4) {
            if (!win.find(str)) {
                while (win.find(str, false, true))
                    n++;
            }
            else {
                n++;
            }

            if (n == 0) {
                alert("未找到指定内容.");
            }
        }
        //获取页面内容
        txt = win.document.body.createTextRange();
        //查找内容
        for (i = 0; i <= n && (found = txt.findText(str)) != false; i++) {
            txt.moveStart("character", 1);
            txt.moveEnd("textedit");
        }
        //如果找到内容
        if (found) {
            txt.moveStart("character", -1);
            txt.findText(str);
            txt.select();
            txt.scrollIntoView();
            n++;
        }
        else {
            if (n > 0) {
                n = 0;
                findInPage(str);
            }
            else {
                alert("未找到指定内容.");
            }
        }
        return false;
    }
</script>

 

HTML代码就算了，很简单！如何布局大家随意！

运行界面大致如此。很丑的界面大家可以做的漂亮些啊！