事件：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. 一起talk C栗子吧（第一百二十四回：C语言实例--内置宏）

    各位看官们,大家好,上一回中咱们说的是显示变量和函数地址的样例,这一回咱们说的样例是:内置宏.闲话休提,言归正转.让我们一起talk C栗子吧! 看官们,我们在编译程序的时候,假设有语法错误,编译器就 ...

  2. 实战c++中的string系列--指定浮点数有效数字并转为string

    上一篇博客讲了好几种方法进行number到string的转换,这里再单独说一下float或是double到string的转换. 还是处于控件显示的原因.比方说要显示文件的大小,我们从server能够获 ...

  3. VUEX action解除页面耦合

    最近项目中需要用到vue+vuex来实现登出跳转功能,老大指派任务要用action解除页面耦合,刚从vue深渊晕晕乎乎爬出来的我是一脸懵逼啊...啥是解除耦合...网上vuex的资料太少了,vuex手 ...

  4. easyUI的tree

    前端使用easyUI,放了一个tree,搞死了. easyUI的tree,后端传过来的数据,是json格式:然后easyUI向后端提交.请求时,会自动将节点的id附在url后面. 主要有两个注意的地方 ...

  5. HDU 2457/POJ 3691 DNA repair AC自动机+DP

    DNA repair Problem Description   Biologists finally invent techniques of repairing DNA that contains ...

  6. 使用JSTL 对在页面上对 0,0,1 的分割处理 forTokens

    使用JSTL 对在页面上对 0,0,1 的分割处理 <tr onmouseover="currentcolor=this.style.backgroundColor;this.styl ...

  7. 【POJ 2152】 Fire

    [题目链接] 点击打开链接 [算法] 同样是树形DP,但是比较难,笔者做这题看了题解 令f[i][j]表示在以i为根的子树中 1.在以i为根的子树中建一些消防站 2.在节点j必须建一个消防站 3.以i ...

  8. eoj 3507 坑爹的售票机

    EOJ 3507 坑爹的售票机   问题描述 oxx 和 xjj 决定和小伙伴们一同坐船前往 Xiamen.去 Xiamen 的船票一张 p 元. 当他们满怀兴致地来到港口时发现居然只有不设找零的自动 ...

  9. MySQL 三种关联查询的方式: ON vs USING vs 传统风格

    看看下面三个关联查询的 SQL 语句有何区别? 1SELECT * FROM film JOIN film_actor ON (film.film_id = film_actor.film_id) 2 ...

  10. 可视化工具Grafana部署

    随着业务的越发复杂,对软件系统的要求越来越高,这意味着我们需要随时掌控系统的运行情况.因此,对系统的实时监控以及可视化展示,就成了基础架构的必须能力. Grafana官方网站 https://graf ...