div 层与层之间的切换 （转）（未…

最新推荐文章于 2023-03-29 17:14:27 发布

feiniu5566

最新推荐文章于 2023-03-29 17:14:27 发布

阅读量1k

点赞数

分类专栏： IT编程

本文链接：https://blog.csdn.net/feiniu55662/article/details/13624525

版权

IT编程专栏收录该内容

50 篇文章 0 订阅

订阅专栏

<html>
<head>
 <body>
  <table width=100% height=100%>   //我为了布局用了个table.你就用决对定位好了
   <tr height=50%>
    <td width=50%> 
     <div id="a" style=border-style:solid>A页面<br>
      <a οnclick=clickdiv('a')>A</a><br>
      <a οnclick=clickdiv('b')>B</a><br>
      <a οnclick=clickdiv('c')>C</a><br>
      <a οnclick=clickdiv('d')>D</a>
     </div>
    </td>
    <td width=50%> 
     <div id="b" style=border-style:solid>B页面<br>
      <a οnclick=clickdiv('a')>A</a><br>
      <a οnclick=clickdiv('b')>B</a><br>
      <a οnclick=clickdiv('c')>C</a><br>
      <a οnclick=clickdiv('d')>D</a>
     </div>
    </td>
   </tr>
   <tr height=50%>
    <td width=50%> 
     <div id="c" style=border-style:solid>C页面<br>
      <a οnclick=clickdiv('a')>A</a><br>
      <a οnclick=clickdiv('b')>B</a><br>
      <a οnclick=clickdiv('c')>C</a><br>
      <a οnclick=clickdiv('d')>D</a>
     </div>
    </td>
    <td width=50%> 
     <div id="d" style=border-style:solid>D页面<br>
      <a οnclick=clickdiv('a')>A</a><br>
      <a οnclick=clickdiv('b')>B</a><br>
      <a οnclick=clickdiv('c')>C</a><br>
      <a οnclick=clickdiv('d')>D</a>
     </div>
    </td>
   </tr>
  </table>
  <script language="javascript">
   function clickdiv(id){
    alldisplay();
    document.getElementByIdx_x(id).style.display="block";  //把你要显示的显示了
   }
   function alldisplay(){  //所有的div都先隐藏掉
    document.getElementByIdx_x('a').style.display="none";
    document.getElementByIdx_x('b').style.display="none"; 
    document.getElementByIdx_x('c').style.display="none"; 
    document.getElementByIdx_x('d').style.display="none";  
   }
  </script>
 </body>
</html>