急请教：网页中，超链接二级页面内容如何在一级页面中指定位置显示？
网页中，超链接二级页面内容如何在一级页面中指定位置显示？也就是说：当点击一级页面导航条中某一超链接（这个超链接是单独的一个网页）后，超链接网页在一级页面中打开，但一级页面中的导航条仍然未动，仍可使用。急求大师们指点，谢谢！
我的代码如下：
主页：
<head>
<!--网页纠错代码开始-->
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide
function killErrors() {
return true;
}
window.onerror = killErrors;
// -->
</SCRIPT>
<!--网页纠错代码结束-->
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="keywords" content="网页制作">
<meta name="description" content="专业主要开设有：护理、财经等多个专业。">
<title>底部固定导航</title>
<link rel="stylesheet" href="css/dh-1.css">
<style>.content { width:1024px; height:auto; border:0px solid #000; margin:0 auto;}.nav { width:100%; height:auto; margin:0 auto; background:#FFFFFF; position:fixed; bottom:0; text-align:center;}
</style>
<script>
<!--
function getNames(obj,name,tij)
{
var p = document.getElementById(obj);
var plist = p.getElementsByTagName(tij);
var rlist = new Array();
for(i=0;i<plist.length;i++)
{
if(plist[i].getAttribute("name") == name)
{
rlist[rlist.length] = plist[i];
}
}
return rlist;
}
function butong_net(obj,name)
{
var p = obj.parentNode.getElementsByTagName("td");
var p1 = getNames(name,"f","div");
for(i=0;i<p1.length;i++)
{
if(obj==p[i])
{
p[i].className = "s";
p1[i].className = "dis";
}
else
{
p[i].className = "";
p1[i].className = "undis";
}
}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body onload=getTime() topmargin="0" marginwidth="0" marginheight="0">
<div id=\"f\" color="#B4EEB4" class="content">
<p>中国好人多</p>
<p> </p>
</div>
<div class="nav" >
<table width="auto" border="0" align="center" cellpadding="0" cellspacing="0" class="ww2">
<SCRIPT language=JavaScript src="daohang-b.js"></SCRIPT>
</table>
<table border="0" align="center" cellpadding="0" cellspacing="0" class="ww1">
<SCRIPT language=JavaScript src="daohang-a.js"></SCRIPT>
</table>
</table>
</div>
</body>
</html>
css文件夹下的css文件一个。如下：dh-1.css：
@charset "utf-8";
/* CSS Document */
.ww1 {width:1024px;background-color:#B6F3B7;border-bottom:3px solid #33cc00;border-left:1px solid #33cc00;border-right:1px solid #33cc00;}
.ww1 td {border-center:1px solid #33cc00;border-top:1px solid #33cc00;height:50px;text-align:center;width:90px;font-size:24px;cursor:hand;}/* font-size:12px为一级菜单字体大小 */
.ww1 td.s {border-top:1px solid #FFFFFF;font-weight:bold;background-color:#FFFFFF;}
.ww2 {width:1024px;border-right:1px solid #33cc00;border-bottom:none;border-left:1px solid #33cc00;border-top:1px solid #33cc00;font-size:18px;}/* font-size:12px为二级菜单字体大小 */
.ww2 a:link {color:#00007f;text-decoration:none;}
.ww2 a:visited {color:#800080;text-decoration:none;}
.ww2 a:hover {color:#00007f;text-decoration:underline;}
.ww2 a:active {color:#00007f;text-decoration:underline;}
.dis {display:block}
.undis {display:none}
body {
margin-top: 5px;
margin-bottom: 5px;
}
.style38 {color: #FF6666}
.style39 {color: #33CC00}
Js文件夹下的js文件2个。如下：
第一个是：daohang-a.js
document.writeln("<tr align=\"center\" valign=\"middle\">");
document.writeln(" <td class=\"s\" onMouseOver=\"butong_net(this,\'butong_net1\')\">导航1</td>");
document.writeln(" <td onMouseOver=\"butong_net(this,\'butong_net1\')\">导航2</td>");
document.writeln(" <td onMouseOver=\"butong_net(this,\'butong_net1\')\">导航3</td>");
document.writeln(" <td onMouseOver=\"butong_net(this,\'butong_net1\')\">导航4</td>");
document.writeln(" <td onMouseOver=\"butong_net(this,\'butong_net1\')\">导航5</td>");
document.writeln(" <td onMouseOver=\"butong_net(this,\'butong_net1\')\">导航6</td>");
document.writeln(" <td onMouseOver=\"butong_net(this,\'butong_net1\')\">导航7</td>");
document.writeln(" <td onMouseOver=\"butong_net(this,\'butong_net1\')\">导航8</td>");
document.writeln(" <td onMouseOver=\"butong_net(this,\'butong_net1\')\">导航9</td>");
document.writeln(" </tr>");
第二个是：daohang-b.js
document.writeln("<tr>");
document.writeln(" <td width=\"780\" height=\"30\" align=\"center\">");
document.writeln(" <div id=butong_net1>");
document.writeln(" <div class=dis name=\"f\">");
document.writeln(" <a href=\"#\">您好！欢迎您光临！</a>");
document.writeln(" </div>");
document.writeln(" <div class=undis name=\"f\">");
document.writeln("<a href=\"/11.htm\" > 导航1-1 </a> <a href=\"/12.htm\"> 导航1-2 </a> <a href=\"/13.htm\" > 导航1-3 </a>");
document.writeln(" </div>");
document.writeln(" <div class=undis name=\"f\">");
document.writeln(" <a href=\"/21.htm\"> 导航2-1 </a> <a href=\"/22.htm\" target=\"_blank\"> 导航2-2 </a> <a href=\"/23.htm\" target=\"_blank\"> 导航2-3 </a> ");
document.writeln(" </div>");
document.writeln(" <div class=undis name=\"f\">");
document.writeln(" <a href=\"/31.html\">导航3-1 </a> <a href=\"/32.htm\" target=\"_blank\"> 导航3-2 </a> <a href=\"/33.htm\" target=\"_blank\"> 导航3-3 </a>");
document.writeln(" </div>");
document.writeln(" <div class=undis name=\"f\">");
document.writeln(" <a href=\"http://hcynzz.\" target=\"_blank\">欢迎您</a>");
document.writeln(" </div>");
document.writeln(" </div>");
document.writeln(" </td>");
document.writeln(" </tr>");
最后想要达到的效果应该是下图：点击导航1-2这个超链接，其起链接对应的网页在A区打开，而原导航栏不会变
[此贴子已经被作者于2020-2-29 20:30编辑过]
demo.zip