通過判斷鏈接方式設置當前樣式

    <style>
        #head{float: left;}
        #head ul li{float: left;list-style: none;padding-left: 15px;}
        .nav{font-size: 18px;font-weight: bold;}
    </style>
    <div id="head">
        <ul>
            <li><a href="okl.html">網站首頁</a></li>
            <li><a href='new.html'>關於我們</a></li>
            <li><a href='about.html'>聯繫我們</a></li>
        </ul>
    </div>

    <script>
        var list=document.getElementById('head').firstElementChild.children;
        var host=window.location.href;
        for(i=0;i<list.length;i++){
            var link=list[i].firstElementChild.attributes['href'].value;
            if(host.indexOf(link)>=0){
                list[i].setAttribute('class','nav')
            }
        }
    </script>