一、代码如下

二、点击前效果

三、点击后效果

<!DOCTYPE html>

<html>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<body>

<h2>JavaScript 能够做什么</h2>

<p id="demo">JavaScript 能够隐藏 HTML 元素。</p>

<button type="button" onclick="document.getElementById('demo').style.display='none'">

点击我！

</button>

</body>

</html>

三、JavaScript之隐藏HTML元素的更多相关文章

  1. ios 下 select和option 无法隐藏指定元素

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. jquery可见性选择器（匹配所有隐藏的元素）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. 用 CSS 隐藏页面元素的 5 种方法

    原文链接:用 CSS 隐藏页面元素的 5 种方法,转载请注明来源! 用 CSS 隐藏页面元素有许多种方法.你可以将 opacity 设为 0.将 visibility 设为 hidden.将 disp ...

  4. CSS 隐藏页面元素的 几 种方法总结

    用 CSS 隐藏页面元素有许多种方法.你可以将 opacity 设为 0.将 visibility 设为 hidden.将 display 设为 none 或者将 position 设为 absolu ...

  5. css隐藏页面元素的方法

    用css隐藏页面元素有许多种方法. 第一种方法[opacity: 0;] opacity属性通常用于设置一个元素的透明度,从另一个角度来看,如果透明度为0,也就从视觉上隐藏了该元素. 这个属性不是为改 ...

  6. 隐藏页面元素 css

    一.前言 在平常的样式排版中,我们经常遇到将某个模块隐藏的场景 通过css隐藏元素的方法有很多种,它们看起来实现的效果是一致的 但实际上每一种方法都有一丝轻微的不同,这些不同决定了在一些特定场合下使用 ...

  7. 使用CSS隐藏HTML元素的4种常用方法

    现在的网页设计越来越动态化,我们经常需要隐藏某些元素,在特定的时候才显示它们.我们通常可以使用4种方法来隐藏和显示元素. 这4种显示和隐藏元素的技术各自有它们自己的优点的缺点,下面来举例说明. 在这篇 ...

  8. JavaScript通过ID获取元素坐标

    JavaScript通过ID获取元素坐标 function getElementPos(elementId) {    var ua = navigator.userAgent.toLowerCase ...

  9. JavaScript实现拖拽元素对齐到网格（每次移动固定距离）

    这几天在做一个拖拽元素的附加功能,就是对齐到网格,实际上就是确定好元素的初始位置,然后拖拽元素时,每次移动固定的距离.让元素都可以在网格内对齐.先上效果图,然后在详细说明一下细节问题 做了一个gif图 ...

随机推荐

  1. 源码安装openldap(转)

    Ubuntu安装OpenLDAP(附错误的详细解决办法) 1 下载OpenLDAP源码 http://www.openldap.org/software/download/ 或者 ftp://ftp. ...

  2. Tomcat的部署、虚拟主机及优化

    Tomcat的部署.虚拟主机及优化 文章目录 Tomcat的部署.虚拟主机及优化 前言 1.Tomcat的名称由来 2.Apache Tomcat 5-7版本差异 2.1Apache Tomcat5. ...

  3. MySQL定时任务event，储存过程（定时删除指定时间前90天指定表的数据）

    MySQL定时任务event,储存过程(定时删除指定时间前90天指定表的数据) 分类: MySql5.x2014-06-23 15:16 1266人阅读 评论(0) 收藏 举报 mysql数据库 &l ...

  4. 搜索控制器UISearchController的使用

    说明:本文主要是将系统UISearchController控件声明文件中的属性.方法.代理等介绍下,后续再联合[搜索栏UISearchBar]这篇文章一起更新更实用的信息. 1.初始化 // 如果设置 ...

  5. Linux中用systemctl命令管理服务

    systemctl start foo.service 启动服务systemctl restart foo.service 重启服务systemctl stop foo.service 停止服务sys ...

  6. android使用友盟实现第三方登录、分享以及微信回调无反应问题解决办法

    这里介绍微信和新浪登录.微信登录和新浪登录都需要申请第三方账号.可以参考官方文档http://dev.umeng.com/social/android/operation#2还是很清晰的. 新浪微博开 ...

  7. vue的高级使用技巧

    全局组件注册 一般组件应用弊端,比较笨拙繁琐低效,比如我们写了一些组件,需要引用上的时候就通过import导入,那如果是高频繁需要使用的组件,则需要在每个使用的时候都需要引入并注册 假设现在有两个组件

  8. js select下拉框下拉跳转代码

    下拉跳转原理很简单这个用到了select的onchangeg事件,只要这里改变我们就获取select值直接location.href=this.value即可. <select name=&qu ...

  9. redis.rpm 安装

    yum install jemalloc wget http://www6.atomicorp.com/channels/atomic/centos/6/x86_64/RPMS/redis-3.0.7 ...

  10. JavaScript 词法句法

    JavaScript 中的几个重要概念 JavaScript 遵循 ECMA-262 规范,目前其最新版是 ECMAScript 2018,而获得所有主流浏览器完全支持的则是 ECMAScript 5 ...