事件:onclick

属性:display

利用if语句实现

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<meta name="description" content="">
<meta name="keywords" content="">

<link href="css1.css" rel="stylesheet" type="text/css"
charset="UTF-8">
</head>
<body>
<input id="btn1" type="button" value="显示隐藏"/>
<div id="div1"></div>
<script src="js1.js"> </script>
</body>
</html>

//////////////////css

#div1{
display:none;
width:100px;
height:300px;
background:green;
}

////////////////////js

var oBtn=document.getElementById("btn1");
oBtn.onclick=function(){
var oDiv=document.getElementById("div1");
if(oDiv.style.display=="none"){
oDiv.style.display="block";
}
else{
oDiv.style.display="none";
}
};

2.3点击菜单显示div再点击就隐藏的更多相关文章

  1. jquery点击添加样式,再点击取出样式

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. radio点击一下选中,再点击恢复未选状态

    radio点击一下选中,再点击恢复未选状态 实现方式1: <input   type="radio"   id="cat"   name="ca ...

  3. js进阶 12-15 jquery如何实现点击button显示列表,点击其它位置隐藏列表

    js进阶 12-15 jquery如何实现点击button显示列表,点击其它位置隐藏列表 一.总结 一句话总结:在button中阻止事件冒泡. 1.如何咋button中阻止事件冒泡(两种方法)? ev ...

  4. js构建函数,点击按钮显示div,再点击按钮或其他区域,隐藏div

    这只是一个例子,先看看效果: html代码: <nav> <span class="nav_logo"></span> <h1>云蚂 ...

  5. React 点击按钮显示div与隐藏div,并给div传children

    最近做了一个react的点击按钮显示与隐藏div的一个小组件: [筛选]组件FilterButton import React,{Component} from 'react'; import {re ...

  6. JQ 点击指定文本框显示div。点击其他区域隐藏DIV

    <input id="username" type="text" style="width:90%;margin-top: 40px;" ...

  7. jquery实现点击显示,再点击隐藏

    //点击a标签,轮流显示和隐藏<div id="timo" style="background-color:red;height:50px;width:50px;& ...

  8. js计时器,点击开始计时,再点击停止

    点击倒计时开始,点击停止,再次点击又开始,再点停止... <i id=</i>秒 <em onclick="timeOpen();">开始</e ...

  9. Jquery点击除了指定div元素其他地方,隐藏该div

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script ty ...

随机推荐

  1. java里int类型转byte类型

    今天在做书上的一个例子的时候, 要使用byte类型,首先我很直接的就写到了byte b = 0XAA, 结果报错, 说从int转换到byte可能会有损失. 我当时就很奇怪, 为什么会出现这种情况呢? ...

  2. windows内存管理的机制以及优缺点

    分页存储管理基本思想:用户程序的地址空间被划分成若干固定大小的区域,称为“页”,相应地,内存空间分成若干个物理块,页和块的大小相等.可将用户程序的任一页放在内存的任一块中,实现了离散分配. 分段存储管 ...

  3. socket.io中文文档

    socket.io 中文文档转载于:http://www.cnblogs.com/xiezhengcai/p/3956401.html 服务端 io.on(‘connection’,function( ...

  4. atom及其插件activate-power-mode下载安装

    Atom是Github推出的一个文本编辑器,其中包含很多插件可以自行下载安装,其中一个最近比较火的就是插件activate-power-mode,可以实现打字屏振效果, 打字带特效哦,所以最近就尝试安 ...

  5. return value, output parameter,

    Return Value https://docs.microsoft.com/en-us/sql/t-sql/language-elements/return-transact-sql?view=s ...

  6. YTU 2800: 逗逗泡泡的保密电文

    2800: 逗逗泡泡的保密电文 时间限制: 1 Sec  内存限制: 128 MB 提交: 229  解决: 114 题目描述 某电报局的电文保密的规律是将每个英文字母变成其后的第4个字母(很原始的那 ...

  7. 认识虚拟化(virtualization)

    0. 基本定义 虚拟化的本质是将现有的计算机资源通过虚拟化的技术分割成若干个计算机资源,这些计算机资源互相独立:其最终目标是提高计算机的利用效率以最大化计算机的灵活性: 虚拟化为数据.计算能力.存储资 ...

  8. 我的第一篇博文,Python+scrapy框架安装。

    自己用Python脚本写爬虫有一段时日了,也抓了不少网页,有的网页信息两多,一个脚本用exe跑了两个多月,数据还在进行中.但是总觉得这样抓效率有点低,问题也是多多的,很早就知道了这个框架好用,今天终于 ...

  9. Python装饰器单例

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/dutsoft/article/details/52057981#!/usr/bin/python#c ...

  10. bzoj2743 [HEOI2012]采花——树状数组+离线

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=2743 和 HH的项链 那道题很像,也是类似的做法: 但不同的是这里的点只有有前驱时才起作用: ...