<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<style type="text/css">

    #div1 {

        width: 100px;

        height:100px;

        background: red;

        display: none;

    }

</style>

<script>

    function showhide(){

        var odiv=document.getElementById('div1');

        if(odiv.style.display=='block')

            {

                odiv.style.display='none';

            }

        else{

            odiv.style.display='block';

        }

    }

</script>

</head>

<body>

<input type="button" value="显示隐藏" onClick="showhide()" />

<div id="div1">

</div>

</body>

</html>

利用JavaScript的if语句判断元素显示隐藏的更多相关文章

  1. JavaScript网站设计实践（四）编写about.html页面，利用JavaScript和DOM，选择性的显示和隐藏DIV元素

    一.现在我们在网站设计(三)的基础上,来编写about.html页面. 这个页面要用到的知识点是利用JavaScript和DOM实现选择性地显示和隐藏某些DIV about.html页面在前面我们为了 ...

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

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

  3. javascript和jquery如何判断元素是否存在最佳。

    在传统的Javascript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在.原因是对一个不存在的元素进行操作是不允许的.例如: document.getElementById(&q ...

  4. jquery判断元素是否隐藏的多种方法

    第一种:使用CSS属性 复制代码 代码如下: var display =$('#id').css('display'); if(display == 'none'){    alert("被 ...

  5. javascript进行百度换肤 和显示隐藏一个窗口的操作

    简单的运用javascript来进行百度换肤的操作 <!DOCTYPE html> <html lang="en"> <head> <me ...

  6. jquery 判断元素显示或隐藏

    $().is(":hidden"); $().is(":visible");

  7. CSS之 元素显示隐藏，用户界面样式，文本溢出隐藏，精灵技术，三角形

    元素的显示与隐藏 display 显示 display 设置或检索对象是否及如何显示 display: none; 隐藏对象 display: block; 除了转换为块级元素, 同时还有显示元素的意 ...

  8. JQuery 控制元素显示隐藏

    JS在浏览器里面做调试的时候,先在浏览器里面找到页面代码加上断点来执行.然后根据执行情况来查找部分变量是否能找到,一点一点的排查内容.可以做筛选条件 部分隐藏.默认让部分条件加上.hide 默认隐藏, ...

  9. js判断元素是否隐藏的方法

    代码如下: JavaScript代码如下: if( document.getElementById("div").css("display")==='none' ...

随机推荐

  1. cocos creator 底部按钮touch延迟

    cocos论坛里有这个问题: http://forum.cocos.com/t/ios-touchstart-bug/63367我的引擎版本:"engine_version": & ...

  2. 关于java中的继承

    我们都知道Java中的继承是复用代码.扩展子类的一种方式,继承使得Java中重复的代码能够被提取出来供子类共用,对于Java程序的性能以及修改和扩展有很大的意义,所以这是一个非常重要的知识点. 那么对 ...

  3. 【转载】Intellij IDEA的Hibernate简单应用

    转载自: https://www.cnblogs.com/yangyquin/p/5438248.html   1.创建数据库及其表 create database demo;    use demo ...

  4. servlet 中文编码设置

    Tomcat服务器默认采用的ISO8859-1编码 产生的原因: 不同数据来源的编(解)码格式不同: 数据来源 默认编码格式 浏览器页面 GBK(可在浏览器页面右键切换) request(get) I ...

  5. Emoji表情处理工具类

    import java.util.regex.Matcher; import java.util.regex.Pattern; public class EmojiToString { /** * 将 ...

  6. 利用vue-gird-layout 制作可定制桌面 （一）

    安装 vue-gird-layout https://github.com/jbaysolutions/vue-grid-layout 先跑一遍demo 运行起来. # install with np ...

  7. leetcode 188-maxProfit

    public static int maxProfit(int k, int[] prices) { if (0 >= k || null == prices || 1 >= prices ...

  8. 洛谷P1060 开心的金明【dp】

    金明今天很开心,家里购置的新房就要领钥匙了,新房里有一间他自己专用的很宽敞的房间.更让他高兴的是,妈妈昨天对他说:"你的房间需要购买哪些物品,怎么布置,你说了算,只要不超过NN元钱就行&qu ...

  9. [bzoj4477 Jsoi2015]字符串树 (可持久化trie)

    传送门 Solution 复习下tire(￣▽￣)/ 裸的可持久化tire,我用树剖求了下LCA Code #include <cstdio> #include <cstring&g ...

  10. 支持移动触摸的jQuery图片Lightbox插件

    简介 这是一款支持移动触摸设备的简洁jQuery图片Lightbox插件.该LightBox插件可以在移动手机和桌面设备中运行,它具有响应式,预加载图片,键盘支持等特点,非常实用.它的特点还有: 响应 ...