本来是想做一个鼠标点击事件：A,B两个东西，B先隐藏，点击A，B出现，再点一次A，B消失，然后发现在判断不同的情况下，出现了一点小问题

暂时没有问题的写法：

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <style type="text/css">

         #div1{

             width: 50px;

             height: 200px;

             background-color: orange;

             display: none;

         }

     </style>

     <script type="text/javascript">

     function showHide(){

         var a=document.getElementById("div1")

         if (a.style.display=="block") {

             a.style.display="none";

         }

         else{

             a.style.display="block";

         }

     }

     </script>

 </head>

 <body>

     <input type="button" value="显示隐藏" onclick="showHide()">

     <div id="div1"></div>

 </body>

 </html>

然后，我把它的判断条件改了一下,其实这是我第一次写的想法：

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <style type="text/css">

         #div1{

             width: 50px;

             height: 200px;

             background-color: orange;

             display: none;

         }

     </style>

     <script type="text/javascript">

     function showHide(){

         var a=document.getElementById("div1")

         // 这里改变了

         if (a.style.display=="none") {

             a.style.display="block";

         }

         else{

             a.style.display="none";

         }

     }

     </script>

 </head>

 <body>

     <input type="button" value="显示隐藏" onclick="showHide()">

     <div id="div1"></div>

 </body>

 </html>

然后它的效果是，第一次点击的时候没有反应，要点第二次，B才会出来，有点不明白

JS点击的更多相关文章

  1. js点击左右滚动+默认自动滚动类

    js点击左右滚动+默认自动滚动类 点击下载

  2. selenium—JS点击方法

    package com.allin.pc;import java.util.NoSuchElementException;import org.openqa.selenium.By;import or ...

  3. 用 JS 点击左右按钮 使图片切换 - 最精简版-ljx2380000-ChinaUnix博客

    body { font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI ...

  4. 项目遇到的小问题（关于vue-cli中js点击事件不起作用和iconfont图片下载页面css样式乱的解答）

     第一个:关于vue-cli中js点击事件不起作用 在vue的methods方法queryBtnFun()中拼接html和click操作事件的时候,发现点击事件一起未起作用: 后来发现是DOM执行顺序 ...

  5. Js点击触发Css3的动画Animations、过渡Transitions效果

    关键是首先指定动画效果的CSS属性名称,然后在Js中改变这个属性 如果不使用Js触发,可以选择利用css的状态:hover,focus,active 来触发,也可以一开始就触发 下例为Js点击触发过渡 ...

  6. JS中点击事件冒泡阻止

    JS中点击事件冒泡阻止 解析: 一个div层'out',内含有一个div层'in'.如下: 两个层都绑定了点击事件,但是点击in层的时候,点击事件会出现冒泡现象,同时也会触发out层的点击事件. 但是 ...

  7. JS 点击元素发ajax请求 打开一个新窗口

    JS 点击元素发ajax请求 打开一个新窗口 经常在项目中会碰到这样的需求,点击某个元素后,需要发ajax请求,请求成功以后,开发需要把链接传给前端(或者说请求成功后打开新窗口),前端需要通过新窗口打 ...

  8. html js点击按钮滚动跳转定位到页面指定位置（DIV）的方法代码

    一:通过html锚点实现滚动定位到页面指定位置(DIV):    如果我们要点击实现跳转的地方是一个html锚点,也就是点击一个A标签超链接实现跳转,可以把A标签的href属性直接指向跳转指定位置的d ...

  9. PHP——0128练习相关2——js点击button按钮跳转到另一个新页面

    js点击button按钮跳转到另一个新页面 投稿:whsnow 字体:[增加 减小] 类型:转载 时间:2014-10-10我要评论 点击按钮怎么跳转到另外一个页面呢?点击图片要跳转到新的页面时,怎么 ...

  10. IOS的UIWebView中JS点击事件，需要加入cursor：pointer;属性才可以

    IOS的UIWebView中JS点击事件,需要加入cursor:pointer;属性才可以. Android的WebView可以支持外链样式,js文件:IOS则需要改为内嵌样式和JS文件.

随机推荐

  1. 目录---Asp.NETCore轻松学系列【目录】

    随笔分类 - Asp.NETCore轻松学系列 Asp.NETCore轻松学系列阅读指引目录 摘要: 耗时两个多月,坚持写这个入门系列文章,就是想给后来者更好更快的上手体验,这个系列可以说是从入门到进 ...

  2. 数据库并发及锁机制及Hibernate锁实现

    数据库事务的定义 数据库事务(Database Transaction),是指作为单个逻辑工作单元执行的一系列操作.一个逻辑工作单元要成为事务,必须满足所谓的ACID(原子性.一致性.隔离性和持久性) ...

  3. 服务端 Cros 配置解决跨域

    <system.webServer> <httpProtocol> <customHeaders> <remove name="Access-Con ...

  4. Dubbox管理中心的部署及使用

    安装: 我们在开发时,需要知道注册中心都注册了哪些服务,以便我们开发和测试.我们可以通过部署一个管理中心来实现.其实管理中心就是一个web应用,部署到tomcat即可. (1)编译源码,得到war包 ...

  5. Administrator 被禁用

    Administrator 被禁用 问题: 重装系统后出现输入用户名和密码的情况,原因是Administrator被禁用. 解决方法: 1.开机后shift+重启 –>选择疑难解答 --> ...

  6. boost pointer container

    1. boost::ptr_vector #include <boost/ptr_container/ptr_vector.hpp> #include <iostream> i ...

  7. JavaScript 的 API设计原则

    一.接口的流畅性 好的接口是流畅易懂的,他主要体现如下几个方面: 1.简单 操作某个元素的css属性,下面是原生的方法: document.querySelectorAll('#id').style. ...

  8. Linux下github的使用

    在linux下搭建git环境 1.创建Github账号,https://github.com 2.Linux创建SSH密钥: ssh-keygen ##一直默认就可以了 3.将公钥加入到Github账 ...

  9. Cisco基础(六)：配置目前网络环境、项目阶段练习

    一.配置目前网络环境 目标: 一家新创建的IT公司,公司位于北京有80多台服务器 目前网络环境使用技术,通过端口映射技术将web服务器发布给Internet: 三层交换:汇聚接入层交换机 默认路由:实 ...

  10. paper 140:TLD视觉跟踪算法(超棒)

    我是看了这样的一个视频:http://www.56.com/u83/v_NTk3Mzc1NTI.html 然后在准备针对TLD视觉跟踪算法来个小的总结. 以下博文转自:http://blog.csdn ...