<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 </head>

 <body style="margin:50px 0;">

 <div style="float:left; margin:0 auto; width:800px; padding-left:40px; line-height:25px;" >

   <ul>

    <li>

    <a href="javascript:showDiv('id2');">显示id1的内容</a>

   </li>

   <li>

    <a href="javascript:showDiv('id1');">显示id2的内容</a>

   </li>

   <li>

    <a href="javascript:showDiv('id3');">显示id3的内容</a>

   </li>

   </ul>

 </div>

 <div id="id1" align="center" style="display:" >

 1111111111111111<a href="javascript:showDiv('id2');">我是id1内容的a链接，点击可回到id2的内容---显示id2内容</a>

 </div>

 <div id="id2" align="center" style="display:none" >

 222222222222222222222<a href="javascript:showDiv('id1');">我是id2内容的a链接，点击可回到id1的内容---显示id1内容</a>

 </div>

 <div id="id" align="center" style="display:none" >

 333333333333333333我是id3内容

 </div>

 <script language="javascript">

 function showDiv(objId){

  var objDiv=document.getElementById(objId);

     var objDiv1=document.getElementById("id1");

  var objDiv2=document.getElementById("id2");

  var objDiv3=document.getElementById("id3");

   objDiv1.style.display="none";

   objDiv2.style.display="none";

   objDiv3.style.display="none";

         objDiv.style.display="";

 }

 </script>

 </body>

 </html>

js通过a链接控制多个DIV只显示其中一个其它隐藏的更多相关文章

  1. div 只显示两行超出部分隐藏

    ; -webkit-box-orient: vertical;line-height: 26px } <td rowspan="2" colspan="2" ...

  2. jq与js的写法，示例回到顶部div滚动显示隐藏

    jq:var top_icon = $('.top_icon')[0]; id写法$('#id'),类写法$('.class'),标签写法$('div') 如:join=document.getEle ...

  3. 前端笔记：div只显示两行内容，多出内容以...显示

    代码: text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-bo ...

  4. JS使用cookie实现DIV提示框只显示一次的方法

    本文实例讲述了JS使用cookie实现DIV提示框只显示一次的方法.分享给大家供大家参考,具体如下: 这里运用JavaScript的cookie技术,控制网页上的提示DIV只显示一次,也就是当用户是第 ...

  5. js 控制Div循环显示 非插件版

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. js 控制展开折叠 div html dom

    js 控制展开折叠 div    html dom <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" ...

  7. js控制div样式显示与隐藏，JS通过点击超链接右边（指定位置）显示一个图标

    原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...

  8. 原生JS的移入溢出控制div的显示与隐藏

    原生JS的移入溢出控制div的显示与隐藏的写法 上面的写法火狐存在兼容性

  9. 利用JS做到隐藏div和显示div

    div的visibility可以控制div的显示和隐藏,但是隐藏后页面显示空白 style="visibility: none;" document.getElementById( ...

随机推荐

  1. WINDOWS的错误代码对应的故障

    WINDOWS的错误代码对应的故障 0000 操作已成功完成. 0001 错误的函数. 0002 系统找不到指定的文件. 0003 系统找不到指定的路径. 0004 系统无法打开文件. 0005 拒绝 ...

  2. Java和Flex整合报错（一）

    1.错误描述 at org.springframework.beans.factory.support.DefaultListableBeanFactory.resolveDependency(Def ...

  3. ONCOCNV软件思路分析之tumor处理

    前期处理 perl脚本统计RC(RC(read counts)) 读入control baseline 和 sigma(最后baseline 预测的mad值) 将gc < 0.28或gc > ...

  4. 关于这个该死的报错：TypeError - 'undefined' is not a function (evaluating '_getTagName(currWindow).toLowerCase()')

    在利用Selenium爬取页面信息的时候突然报错,第一条信息爬取的时候还好好的,第二条就不行了. 请参考网上的爬取代码: # coding=utf-8"""Created ...

  5. windows下安装MongoDB进度条不动

    windows 下安装MongoDB, 在 Installing MongoDB Compass...(this may take a few minutes) 一步,会停留很长时间,点击取消可能也会 ...

  6. 关于省市联动的bug

    一,问题描述 1.1,原来的思路 1.1.1,初始化加载省份 $.ajax({ 'type' : 'POST', 'dataType' : 'json', 'url' : '${rc.contextP ...

  7. span是没有value标签的，要向获得标签内部的值改怎么办。

    1,js实现 var div = document.getElementById('divId');var spans = div.getElementsByTagName('span');var s ...

  8. ArXiv最受欢迎开源深度学习框架榜单：TensorFlow第一，PyTorch第四

    [导读]Kears作者François Chollet刚刚在Twitter贴出最近三个月在arXiv提到的深度学习框架,TensorFlow不出意外排名第一,Keras排名第二.随后是Caffe.Py ...

  9. 【BZOJ1013】球形空间产生器（高斯消元）

    [BZOJ1013]球形空间产生器(高斯消元) 题面 Description 有一个球形空间产生器能够在n维空间中产生一个坚硬的球体.现在,你被困在了这个n维球体中,你只知道球 面上n+1个点的坐标, ...

  10. [BZOJ1009] [HNOI2008] GT考试 (KMP & dp & 矩阵乘法)

    Description 阿申准备报名参加GT考试,准考证号为N位数X1X2....Xn(0<=Xi<=9),他不希望准考证号上出现不吉利的数字. 他的不吉利数学A1A2...Am(0< ...