<!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. 修改MyEclipse行数的颜色

    修改MyEclipse行数的颜色 1.未修改前,行数的颜色 2.依次选择"Window--->Preferences" 3.选择"General--->Edi ...

  2. directX根据设备类GUID查询所属的filter

    hr = m_pSysDevEnum->CreateClassEnumerator(*clsid, &pEnumCat, 0);    ASSERT(SUCCEEDED(hr));    ...

  3. hdu5751 Eades

    今天热身考到FFT,完全忘光了,模板敲错了... 晚上温习下以前的题目 这题就是从最大值每次分割现在的区间,这样递归的区间最大值会更小,对于每种最大值都是卷积做 #include<bits/st ...

  4. 最新数组方法（包括es6）

    整理目前所用过的数组方法,学习了新增的es6方法. 1 arr.push() 从后面添加元素,返回值为添加完后的数组的长度 let arr = [1,2,3,4,5] console.log(arr. ...

  5. 在Visual Studio 2012中使用GSL

    1. 下载GSL http://gnuwin32.sourceforge.net/packages/gsl.htm 下载 Complete package, except sources和Source ...

  6. 升级adb注意事项

    最近使用adb devices老提示设备offline,百度试了好多方法都不行,后面才发现是因为没有把adb文件的名称中含有adb的所有文件复制到 c:/windows/system目录,复制完后只记 ...

  7. monkeyrunner_获取apk的包名和activity名

    一.使用adb获取单个apk的包名和Activity名称: 1.配置adb环境 a. 我的电脑点击右键-属性-高级-环境变量; b.  环境变量中新建PATH,变量值输入adb.exe工具所在目录; ...

  8. Codeforces Round #467 (div.2)

    Codeforces Round #467 (div.2) 我才不会打这种比赛呢 (其实本来打算打的) 谁叫它推迟到了\(00:05\) 我爱睡觉 题解 A. Olympiad 翻译 给你若干人的成绩 ...

  9. 【BZOJ1717】产奶的模式（后缀数组）

    [BZOJ1717]产奶的模式(后缀数组) 题面 权限题 hihocoder 洛谷 题解 \(hihocoder\)里面讲的非常好了 这题要求的就是最长可重叠重复K次子串 所谓相同的子串 我们可以理解 ...

  10. python 常见算法

    python虽然具备很多高级模块,也是自带电池的编程语言,但是要想做一个合格的程序员,基本的算法还是需要掌握,本文主要介绍列表的一些排序算法 递归是算法中一个比较核心的概念,有三个特点,1 调用自身 ...