本文从学习角度出发,仅当做笔记。高手可以忽略本文。

借助div的display属性可以实现div的显示或隐藏,而且在隐藏后不占用原来显示的空间。

js控制显示和隐藏的代码:

 <script type="text/javascript">
function showDiv(obj){
document.getElementById(obj).style.display="";
//alert('已经显示');
}
function hideDiv(obj){
document.getElementById(obj).style.display="none";
//alert('已经隐藏');
}
</script>

HTML:

     <input name="btnShow" type="button" value="显示" onClick="showDiv('div1');">
<input name="btnHide" type="button" value="隐藏" onClick="hideDiv('div1');">
<div id="div1" style=" width:300px; height:200px; border:1px solid red;">
show it
</div>

这个有时候在界面的设计上会用得到。

div的显示和隐藏的更多相关文章

  1. jquery判断div是否显示或者隐藏

    jquery判断div是否显示或者隐藏 很多时候会要判断一个div是不是显示着,没显示要怎么处理,显示的如何处理: 方法很简单,选择到你要判断的div,再用is(':hidden')判断是否隐藏:或者 ...

  2. jquery实现点击控制div的显示和隐藏

    我们使用点击显示.点击隐藏的时候,一般有两种可选方案 .示例 html <div class="index"> <h1> 首页 </h1> &l ...

  3. jquery怎么实现点击一个按钮控制一个div的显示和隐藏

    示例html 1 2 <div class="abc" style="display:none"></div> <input ty ...

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

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

  5. 简简单单,jquery中,使用checkbox控制div的显示与隐藏

    今天开发代码时,发现好久不用jquery就生疏了. 所以作这个记录, 使用checkbox控制div的显示与隐藏. 一,html代码处: <input type="checkbox&q ...

  6. javascript实现div的显示和隐藏

    http://www.cnblogs.com/oec2003/archive/2007/05/05/736492.html <html> <head> <meta htt ...

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

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

  8. js div的显示和隐藏

    <head>    <title></title>    <style type="text/css">        div    ...

  9. JS——取消事件冒泡,实现div的显示与隐藏 event.cancelBubble = true;

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

随机推荐

  1. win7 windows server 2008R2下 https SSL证书安装的搭配(搭配https ssl本地测试环境)

    原文:http://www.cnblogs.com/naniannayue/archive/2012/11/19/2776948.html 要想成功架设SSL安全站点关键要具备以下几个条件. 1.需要 ...

  2. CSS样式汇总

    1. Overflow: 是否隐藏超出容器范围之外的内容,主要参数包括Hidden(隐藏),Auto(根据容器内容自动显示滚动条),scroll(显示滚动条,即使内容不超出容器范围,也会显示一个边框, ...

  3. 经典SQL语句大全以及50个常用的sql语句

    经典SQL语句大全 一.基础 1.说明:创建数据库CREATE DATABASE database-name 2.说明:删除数据库drop database dbname3.说明:备份sql serv ...

  4. IntelliJ IDEA 修改包名

    1.首先将AndroidManifest的Package Name重命名(快捷键shift+F6或者右键Refctor然后Rename)这时Package Name就改变了,但是Src的文件名还没变2 ...

  5. 通过一行代码学习javascript

    [].forEach.call($$("*"), function (a){ a.style.outline = "1px solid #"+(~~(Math. ...

  6. iOS应用之间跳转

    本篇博文将涉及到以下知识点: app应用跳转的原理解析 如何实现两个app应用之间的跳转 如何实现两个app之间跳转到指定界面 二.应用跳转原理 相信从一个应用跳转到另一个应用大家并不陌生,最常见的莫 ...

  7. ABAP认识

    ABAP是一种高级企业应用编程语言(Advanced Business Application Programming),起源于20世纪80年代.经过不断的发展,现在的版本为ABAP/4,SAP R/ ...

  8. oracle procedure

    http://www.cnblogs.com/wuhenke/archive/2010/03/20/1690535.html

  9. CodeForces #367 div2 C

    题目链接: Hard problem 题意:每个字符串可以选择反转或者不反转,给出反转每个字符串的代价,问使最少的代价使得这个字符串序列成字典序. dp[i][j] = x : 第一维是第i个字符串, ...

  10. git在本地仓库直接使用rm彻底删除文件,服务端还是存在

    本地仓库:A和B 服务器:C 今天在本地仓库A希望删除一个文件test,于是执行以下命令: 1 2 3 4 $ sudo rm test $ git add . $ git commit -m &qu ...