JS关闭DIV

HTML

<div id="bar1">
<p onclick="removeElement('bar1')">关闭</p>
</div>
<div id="bar2">
<p onclick="removeElement('bar2')">关闭</p>
</div>

JS

<script type="text/javascript">
function removeElement(id)
{
document.getElementById(id).style.display="none";
}
</script>

JS显示DIV

<div onclick="showOtherDiv()" style="border:1px solid #fff">点击显示另一个div</div>
<div id="otherDiv" style="display:none;border:1px solid red">点击后显示的div</div> <script type="text/javascript"> function showOtherDiv(){
//获取要显示的div对象
var otherDiv=document.getElementById('otherDiv');
//显示
otherDiv.style.display="block";
} </script>

JS 显示隐藏DIV的更多相关文章

  1. 锋利的Jquery(点击显示隐藏div)

    点击显示隐藏div <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  2. 点击按钮显示隐藏DIV,点击DIV外面隐藏DIV

    点击按钮显示隐藏DIV,点击DIV外面隐藏DIV 注意:此方法对touch事件不行,因为stopPropagation并不能阻止touchend的冒泡 <style type="tex ...

  3. js jQuery显示隐藏div的几种方法

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/qq_36135335/article/d ...

  4. JQuery - 垂直显示隐藏DIV

    效果: 代码: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebFor ...

  5. [jquery]显示隐藏div标签的几种方法

    1.$("#demo").attr("style","display:none;");//隐藏div $("#demo" ...

  6. jquery动态为个span,input,div,等标签赋值的方法总结,js动态隐藏div

    1.jquery为span和div标签赋值. <span id="span1"></span> <div id="div1"> ...

  7. jQuery显示隐藏div的几种方法

    1.$("#demo").attr("style","display:none;");//隐藏div $("#demo" ...

  8. 利用JS做到隐藏div和显示div

    div的visibility可以控制div的显示和隐藏,但是隐藏后页面显示空白 style="visibility: none;" document.getElementById( ...

  9. 点击自动显示/隐藏DIV代码。(简单实用)

    注:本文由Colin撰写,版权所有!转载请注明原文地址,谢谢合作! 很多时候我们需要将DIV的信息默认为隐藏状态,只有当用户点击时才显示DIV中包含的提示文字.这类效果在互联网上应用得很多,但实现的方 ...

随机推荐

  1. Git - 信息查看

    git help git version # Display the version of git. git help # Prints the synopsis and a list of the ...

  2. d3.js在vue项目中的安装及案例

    1. 安装: npm i d3 --save 2. 引入:main.js import * as d3 from "d3"; Vue.prototype.$d3 = d3; win ...

  3. POJ 2661

    #include<iostream> #include<stdio.h> using namespace std; int main() { //freopen("a ...

  4. POJ 2583

    #include<iostream> #include<stdio.h> using namespace std; int main() { //freopen("a ...

  5. Git使用、Git配置、Git提交代码、Git上传

    非教程,只是自己的一个简单笔记.建议没有入门的朋友,直接看git的官方help文档: https://help.github.com/articles/set-up-git 1.注册一个git账号,超 ...

  6. PHP:WampServer下如何安装多个版本的PHP、mysql、apache

    作为Web开发人员,在机器上安装不同版本的php,apache和mysql有时是很有必要的. 今天,我在调试一套PHP程序的时候,该程序中使用的某些函数在低版本中无法使用,所以只能在搞个高版本的php ...

  7. JVM 运行时数据区详解

    一.运行时数据区 Java虚拟机在执行Java程序的过程中会把它所管理的内存划分为若干个不同数据区域. 1.有一些是随虚拟机的启动而创建,随虚拟机的退出而销毁,所有的线程共享这些数据区. 2.第二种则 ...

  8. vue实现短信验证码登录

    无论是移动端还是pc端登录或者注册界面都会见到手机验证码登录这个功能,输入手机号,得到验证码,最后先服务器发送请求,保存登录的信息,一个必不可少的功能 思路 1,先判断手机号和验证是否为空, 2,点击 ...

  9. 资深程序员的Metal入门教程总结

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由落影发表于云+社区专栏 正文 本文介绍Metal和Metal Shader Language,以及Metal和OpenGL ES的差异 ...

  10. RedHat Linux下MQ安装步骤及MQ常用命令

    1.检查操作系统及内存情况:lsb_release -a; 2   检查java 环境:java -version 3   新建用户空间.用户和组: //创建用户目录 mkdir /home/mqm ...