<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title></title>

<style type="text/css">

#box{

width: 100px;

height: 100px;

background-color: #F0F;

display: none;

}

</style>

</head>

<script type="text/javascript">

window.onload=function(){

var oBtn=document.getElementById('btn');

var oDiv=document.getElementById('box');

oBtn.onclick=function(){

if(oDiv.style.display=='none'){

oDiv.style.display='block';

}else{

oDiv.style.display='none';

}

}

}/*if的判断条件找的是行间样式 现在行间样式是display:block; 所以第一次执行的是oDiv.style.display='none';正确做法 1. if(oDiv.style.display=='block'){

oDiv.style.display='none';

}else{

oDiv.style.display='block';

}

2. 把内部样式的display:none;改为 行间样式display:none; */

</script>

<body>

<input type="button" value="登陆" id="btn">

<div id="box"></div>

</body>

</html>

js显示隐藏的更多相关文章

  1. JS 显示隐藏DIV

    JS关闭DIV HTML <div id="bar1"> <p onclick="removeElement('bar1')">关闭&l ...

  2. 执行js，通过js显示隐藏的输入框，或者给input赋值

    在测试过程中,有些输入框是隐藏的,如果直接对他进行赋值,会找不到这个输入框,从而导致脚本运行失败. 例如下面的这个密码输入框: 登录密码输入框分为两个input,下面的是提示的,上面的才是真正存下来的 ...

  3. JS控制文本框中的密码显示/隐藏功能

    <html> <head> <title>[荐]JS控制文本框中的密码显示/隐藏功能_网页代码站(www.6a8a.com)</title> <s ...

  4. js和jquery实现显示隐藏

    (选择的重要性) 当点击同一个按钮的时候实现显示影藏 <a id="link" class="b-btn-four task-resolve add-sub-tas ...

  5. 移动端右侧导航 显示隐藏js

    transform与fixed影响 html按钮 <span class="nav-btn"></span> <span class="cl ...

  6. js获取元素显示隐藏的当前状态

    js获取元素显示隐藏的当前状态 // CSS var display = $("."+cls).css("display"); if(display == &q ...

  7. 旁门左道通过JS与纯CSS实现显示隐藏层

    想必大家在开发前端页面时,肯定少不了显示隐藏层这一技术点.那么我简单粗暴地总结了以下两个小demo. 要实现该截图的功能:鼠标移动到我的好友这个选项卡时,灰色的隐藏层就会出现.

  8. JS组件系列——显示隐藏密码切换的jQuery插件

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...

  9. js进阶 13-3 jquery动画显示隐藏，滑动，淡入淡出的本质是什么

    js进阶 13-3 jquery动画显示隐藏,滑动,淡入淡出的本质是什么 一.总结 一句话总结:分别改变display,高度,opacity透明度这三种属性. 1.fade系列函数有哪四个? fade ...

随机推荐

  1. 读懂UI设计的心理学

    好文转载,版权归原作者 作为UI设计师,对待用户就像对待婴儿,知道如何通过界面设计诱导用户非常重要,这就需要了解心理学方面的知识了.今天分享一篇日本设计师的好文,结合心理学与设计,教你读懂心理学,提高 ...

  2. Android下百度地图开发（一）：基础地图展示

    最终效果如: 这个需要详细说下,准备工作较为繁琐. 第一步:去百度申请一个开发者账号,新建一个android应用,会让你输入开发者SHA1,目前我只拿到开发版SHA1,发布版那里也填的是这个. 获取方 ...

  3. jquery的each()详细介绍

    each()方法能使DOM循环结构简洁,不容易出错.each()函数封装了十分强大的遍历功能,使用也很方便,它可以遍历一维数组.多维数组.DOM, JSON 等等在javaScript开发过程中使用$ ...

  4. ios程序发布测试打包

    1. 获取测试机UDID 手机连接电脑,打开iTunes-摘要-点击序列号,设备概要界面显示设备udid-反键-拷贝 2. 添加设备 取得UDID后,进入开发者中心-iOS PRovisioning ...

  5. 使用linq的好处

    1.linq非常方便,把复杂的业务逻辑从数据库分离,起到了很好的优化作用 2.linq非常灵活,可以用基本统一的访问方式,访问各种数据源,对项目的管理和维护,起到了十分便捷的作用 3.用linq可以不 ...

  6. SQL SELECT INTO使用

    SQL SELECT INTO 语句可用于创建表的备份复件. SELECT INTO 语句 SELECT INTO 语句从一个表中选取数据,然后把数据插入另一个表中. SELECT INTO 语句常用 ...

  7. 关于C#垃圾回收

    1.C#垃圾收集器(GC)原理 在C#中托管的资源是无法由程序员管理的,创建销毁都要通过GC来执行.但垃圾收集器有个特点,它是懒惰的,它并不会在变量出了作用域和生命期后立即回收,而是在它认为适当的时候 ...

  8. 解决Windows下网络原因Composer安装失败问题

    由于Composer镜像都在国外,所以直接在官网下载Windows Installer后安装很多情况下是无法成功安装的. 解决办法: 1,将php添加到系统环境变量,并开启openssl扩展. 2,点 ...

  9. 个人训练记录-赛码"bestcoder"杯中国大学生程序设计冠军赛

    A.Movie 题意是给n个线段,要求求出是否存在三个不相交的线段,是的话输出yes,否则输出no.根据贪心的想法,可以先找出右端点r'最小的线段,他是三条线段中最左的那条,再找出左端点l'最大的线段 ...

  10. 启动Tomcat服务器报错

    启动Tomcat服务器报错: Several ports (8005, 8080, 8009) required by Tomcat v5.5 Server at localhost are alre ...