畢設專案中對功能進行劃分，大約分為六類，這些都在主頁的一個導航欄中，原來是打算，對每一個劃分都作為一個連結，點選後跳轉到另一個頁面，但是現在主流網站大部分並非如此做法，例如：點選導航欄中的某一個按鈕，而這個導航欄一般在整體頁面上方或者左側，點選按鈕後，頁面主體並未發生變化，發生變化的僅僅是下方或者右側，稱為子視窗。

實現原理：iframe標籤,在一個合適的位置新增iframe標籤，這裡用的就是導航欄在上方，子視窗在下方的例子，如：
導航欄看自己喜好，關鍵的是button，onclick屬性。

<li style="margin-right: 5px;background-color: #ffffff;"
 
><a href="#" style="color: #000000" onclick="changeToMainPage()">首頁</a>
</li>
<li style="margin-right: 5px;"><button class="dropdown-toggle"                                                         style="color:#fff;margin-left: 10px;background:none;border:0;cursor:pointer;position: relative;top: 11px;"
 
                                                       type="button"  onclick="changeToTeamTravel()">×××</button></li>

上方程式碼塊中，onclick中涉及兩個function，changeToMainPage()、changeToTeamTravel()。
子視窗程式碼塊：id為iframe1。

<div class="row">
<iframe name="iframe1" id="iframe1" src="newworks.jsp"
 
 width="100%" height="100%">

</iframe>
</div>

js：獲取id，更改其src。

<script language="JavaScript">
    function changeToMainPage(){
        var iframe1=document.getElementById("iframe1");
        iframe1.src="/lv/mainpage/mainpage.jsp";
        return true;
    }
    function changeToTeamTravel(){
        var iframe1=document.getElementById("iframe1");
        iframe1.src="help.jsp";
        return true;
    }
</script>