<html>
<head>
<title>HTML元素的显示与隐藏控制</title>
<script type="text/javascript">
function showAndHidden1(){
var div1=document.getElementById("div1");
var div2=document.getElementById("div2");
if(div1.style.display=='block') div1.style.display='none';
else div1.style.display='block';
if(div2.style.display=='block') div2.style.display='none';
else div2.style.display='block';
}
</script>
</head>
<body>
<div>display：元素的位置不被占用</div>
<div id="div1" style="display:block; background:#eee;">DIV 1</div>
<div id="div2" style="display:none; background:#fcc">DIV 2</div>
<input type="button" onclick="showAndHidden1();" value="DIV切换" />
</body>
</html>

两个DIV的切换的更多相关文章

  1. 两个div叠加触发事件发生闪烁问题

    今天遇到一个问题,想实现一个功能: 当鼠标移到div1上的时候,会出现div2.出现时div2在div1的上面,div2在出现后发生闪烁的问题. 于是开始找问题根源,发现原来是因为当我们触发div1的 ...

  2. 两个div横向排列，顶端对齐的方式。

    1.左右两个div都设置为float:left,如果右边div没有设置宽度,右边div的宽度会根据div里的内容自动调整. <!DOCTYPE html PUBLIC "-//W3C/ ...

  3. 一个页面两个div（一个柱状图或者折线图一个饼图）

    需求是一个页面中两个图,一个饼图一个折线图,接口用的是一个接口,柱状图的图例要隐藏掉,X轴为月份,每月份都有两个数据,也就是图例是两个(进口和出口)的意思饼图需要显示最新月份数据,并且有一个下拉框可以 ...

  4. div+css:两个div并排等高 (table-cell)

    两个div并排等高 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  5. 如何让两个div在同一行显示?一个float搞定

    最近在学习div和css,遇到了一些问题也解决了很多以前以为很难搞定的问题.比如:如何让两个div显示在同一行呢?(不是用table表格,table对SE不太友好)其实,<div> 是一个 ...

  6. [IOS 实现TabBar在Push后的隐藏 以及 两级Tabbar的切换]

    翻了好多网页都没找到资料,自己试了下终于成功了,遂分享一下. 1.实现TabBar在Push后的隐藏 假如结构是这样 NavController->A->B,我们想要实现在A里有Tabba ...

  7. jquery 当前链接激活传递参数|div的切换显示

    一.链接激活时传递参数 $("a").click(function(){ var obj=$(this).attr("field"); //获取当前field ...

  8. css两个form不换行，两个div并排代码

    1.form不换行通过table布局实现 <table> <tr> <td> <form method="get" action=&quo ...

  9. html/css 两个div在同一行

    在界面设计的时候,经常需要将两个div在同一行显示. 但是每次都会忘记怎么做,特此随笔,备忘. 如以下要将“第一个div”和“第二个div”显示在同一行: <div id="id1&q ...

  10. 如何定义让两个div横向排列

    方法一: 一般情况,默认的div是写一个换一行,那么如何定义两个div横向排列而不换行呢? div默认的display属性是block.所以每一个div都是新的一行,现在把display换成inlin ...

随机推荐

  1. 不可忽略的.gitignore_global

    会不会很奇怪,本地的代码运行没有问题,以为自己提交到远程仓库了 但是别人下载下来却没有,有没有可能是你根本没提交上去,对了,你真的有可能没提交上去 你本地这个文件是灰色的,确实没有提交上去,但是项目中 ...

  2. python 读取xls文件

    import xlrdfrom xlrd import xldate_as_tuplefrom IPScriptUtil import *from serverTest import *import ...

  3. QT 连接SQLIte数据库

    1.新建一个qt应用程序 2.在.pro文件中添加 sql     (下图,可以查看使用方法) 添加结构查看: 3.开始连接数据库 4.运行结果查看: 5.查看数据库文件: 6.使用可视化工具创建一个 ...

  4. 容器 之搭建 jenkins ci 平台

    1 部署 gitlab docker run -d \ --name gitlab \ -p 8443:443 \ -p 80:80 \ -p 9998:22 \ -v $PWD/config:/et ...

  5. Linux-curl下载报错解决方法

    报错提示: curl: (92) HTTP/2 stream 1 was not closed cleanly before end of the underlying stream ==> E ...

  6. HJ77 火车进站

    描述 给定一个正整数N代表火车数量,0<N<10,接下来输入火车入站的序列,一共N辆火车,每辆火车以数字1-9编号,火车站只有一个方向进出,同时停靠在火车站的列车中,只有后进站的出站了,先 ...

  7. centos6.5最小安装不能联网

    因为个人需要,在一台笔记本安装centos6.5最小安装时遇到了无法有线联网,后面经过了几个小时的处理 总算理清楚并解决了这个问题.亲测有效而不是转载! 如上图所示 处理这个问题颇有感受,在网上找了很 ...

  8. Delphi获取程序版本号

    参考: http://www.delphitop.com/html/hanshu/4627.html procedure GetVersionInfo(const FileName:string; v ...

  9. FTP主动模式（Port）和被动模式（Passive）的区别

    1.FTP的PORT(主动模式): PORT中文称为主动模式,工作的原理: FTP客户端(1024以上端口)连接到FTP服务器的21端口,发送用户名和密码登录, 登录成功后要list列表或者读取数据时 ...

  10. 性能测试-sysstat工具包（mpstat-主要查看CPU负载与iostat-看数据换入换出以及pidstat-主要看上下文切换）

    1.mpstat概述 mpstat (multiprocessor state) 可以查看所有cpu的平均负载,也可以查看指定cpu的负载.所以mpstat其实就是主要查看CPU负载的一个工具.是一款 ...