怎样实现动态增减标签的标签页？
小弟需要设计一个网页，实现标签页，但要根据点击的新页面增减标签，酷似一些浏览器，页面都载入的标签中，
现在没什么进展，不知道用什么控件还是直接用html写，请高手指教。
[解决办法]
用Html写就可以了.
参考:
- HTML code
<style> .tab { width:100px; padding-left:22px; height:17px; padding-top:5px; border-left:none; cursor:pointer; float:right; background-image:url(../images/tab.gif); background-repeat:no-repeat; } .tabsel { width:100px; padding-left:22px; height:17px; padding-top:5px; border-left:none; cursor:pointer; float:right; background-image:url(../images/tabsel.gif); background-repeat:no-repeat; } .closeimg { float:right; padding-right:10px; } .tabtext { text-align:center; float:left; padding-top:3px; padding-left:3px; padding-bottom:1px; } </style></head><body> <div class="title"> <br /> <div style="text-align: center;" id="divPanel"> <div class="tabsel" id="divTable" onclick="javascript:ShowTab(this);"> <div class="tabtext"> 默认页</div> <img class="closeimg" src="../images/tabclosesel.jpg" onclick="javascript:CloseTab(this)" /> </div> </div> </div> <div id="divFrames" style="width: 100%; border-top: solid 0px red"> <iframe id="iframeDefault" src="welcome.htm" width="100%" name="main"></iframe> </div> </body></html><script type="text/javascript"> SetIframeHeight(); function SetIframeHeight() { document.getElementById("iframeDefault").height = document.documentElement.clientHeight-82; document.getElementById("iframeDefault").contentWindow.onload = function() { //document.getElementById("divTable").innerHTML = document.getElementById("iframeDefault").contentWindow.document.title; } } window.onresize=function() { // SetIframeHeight(); } function Navigage(url,title) { //$("divTable").innerHTML = title; SetDivHtml($("divTable"),title); //$("iframeDefault").contentWindow.location = url; $("iframeDefault").src = url; ShowTab($("divTable")); // window.open(url,"main","",true); // alert( $("iframeDefault").contentWindow.location); } var aryTab = new Array(); aryTab[0] = $("divTable"); aryTab[0].iframe = $("iframeDefault"); var CurTab = aryTab[0]; var gOpenedUrl = new Object(); function NewTab(url,title) { if(gOpenedUrl[url] != null) { //alert("该页面已经打开!"); gOpenedUrl[url].click();//选中 return false; } var div = document.createElement("DIV"); div.className = "tabsel"; var divText = document.createElement("DIV"); divText.className = "tabtext"; div.appendChild(divText); var img = document.createElement("IMG"); img.src = "../images/tabclosesel.jpg"; img.className = "closeimg"; img.onclick = function() { CloseTab(img); } div.appendChild(img); $("divPanel").appendChild(div); var iframe = document.createElement("IFRAME"); iframe.src = url; iframe.width = "100%" iframe.height = document.documentElement.clientHeight-42; $("divFrames").appendChild(iframe); if(CurTab !=null) { CurTab.iframe.style.display = "none"; CurTab.getElementsByTagName("img")[0].src = "../images/tabclose.jpg"; CurTab.className = "tab"; } div.iframe = iframe; aryTab[aryTab.length] = div; CurTab = div; SetDivHtml(div,title) div.onclick = function() { ShowTab(div); } gOpenedUrl[url] = div; div.url = url; } function ShowTab(divTab) { if(CurTab !=null) { CurTab.iframe.style.display = "none"; CurTab.getElementsByTagName("img")[0].src = "../images/tabclose.jpg"; CurTab.className = "tab"; } divTab.iframe.style.display = ""; divTab.className = "tabsel"; divTab.getElementsByTagName("img")[0].src = "../images/tabclosesel.jpg"; CurTab = divTab; } function SetDivHtml(div,HTML) { var txtDiv = div.childNodes[0]; txtDiv.innerHTML = HTML; } function CloseTab(img) { var tab = img.parentNode; var preTab = tab.previousSibling; if(preTab ==null) return; if(preTab!=null && preTab.tagName ==null) { preTab = preTab.previousSibling; } var frm = tab.iframe; frm.parentNode.removeChild(frm); tab.parentNode.removeChild(tab); delete gOpenedUrl[tab.url]; if(document.all) { preTab.click(); } else{ var evt = document.createEvent("MouseEvents"); evt.initEvent("click", true, true); preTab.dispatchEvent(evt); } } function $(id){ return document.getElementById(id);} </script>