<!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. 如何给filter添加自定义接口及调用

    本例子是在VirtualCamera的基础上添加的自定义接口用来实现exe控制osd的显示. 1. 接口部分 #ifndef __H_MyFilter__#define __H_MyFilter__# ...

  2. OpenStack_I版 1.准备过程

    openstack是一个开源云平台,python开发   此次部署为实验环境, 采用扁平化简单的网络架构部署                       优点:低耦合的,模块化            ...

  3. CF198 div1 D - Iahub and Xors

    简单说就是左边x,y按照奇偶分为四种对于答案的影响都是不相关的 #include<bits/stdc++.h> using namespace std; typedef long long ...

  4. visual studio编写C#代码时“未能从程序集.....中加载类型”和“找不到方法”的一种可能的解决办法

    编译前报错:$exception    {"未能从程序集"XSW.MySQLDAL, Version=1.0.0.0, Culture=neutral, PublicKeyToke ...

  5. JavaScript的作用域详解。

    首先讲原理,大家都知道JS是逐行执行,首先进入作用域只有有两种方式:  1.当看到script标签的时候,进入到作用域,也就是内置的<script></script>     ...

  6. 第四篇：Web框架 - Django

    前言 Django是一个开放源代码的Web应用框架,由Python写成.它和J2EE一样,采用了MVC的软件设计模式,即模型M,视图V和控制器C. 本文将讲解DJango框架,并从实际应用的角度讲解一 ...

  7. 【POI2001】【HDU1814】和平委员会

    题面 Description 根据宪法,Byteland民主共和国的公众和平委员会应该在国会中通过立法程序来创立. 不幸的是,由于某些党派代表之间的不和睦而使得这件事存在障碍. 此委员会必须满足下列条 ...

  8. 【NOIP2016】蚯蚓（队列，单调性）

    题目不再重复叙述 请参考: 洛谷 CJOJ 题解 先来说说非完美解法,也是我去年考场上的做法 考虑一下每一只蚯蚓增加的长度, 这个值并不需要每一次依次增加, 用一个变量维护即可,每次取出蚯蚓就加上这个 ...

  9. UNDO及MVCC、崩溃恢复

    UNDO特性:避免脏读.事务回滚.非阻塞读.MVCC.崩溃恢复 事务工作流程(图2) MVCC原理机制 崩溃恢复:redo前滚.undo回滚 长事务.大事务:危害.判断.处理 UNDO优化:实现und ...

  10. 从 HelloWorld 看 Java 字节码文件结构

    很多时候,我们都是从代码层面去学习如何编程,却很少去看看一个个 Java 代码背后到底是什么.今天就让我们从一个最简单的 Hello World 开始看一看 Java 的类文件结构. 在开始之前,我们 ...