Div点击显示再次点击隐藏

2023-11-10

1.先上效果
---------------------------------------------------------这是默认显示的时候------------------------------------------
在这里插入图片描述
-----------------------------------------------这是再点击隐藏的时候------------------------------------------
在这里插入图片描述

下方代码贴出,有需要的C-V直接浏览器查看!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
<style>

</style>
<script type="text/javascript" >
	//点击div事件
	function showOrHideDiv(){
		var showState = document.getElementById("testDivId").style.display;
		if (showState == "none") {
				document.getElementById("testDivId").style.display = "block";
		} else {
				document.getElementById("testDivId").style.display = "none";
		}
	}
</script>
</head>
<body>
	<div id="testDivId" style="background-color:black;height:500px;width:500px;">
		
	</div>
	<h1 οnclick="showOrHideDiv()" style="color:red;">点我显示/隐藏DIV</h1>
</body>
</html>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Div点击显示再次点击隐藏 的相关文章

  • 单击量角器中元素的给定坐标

    我想点击我的特定位置canvas元素 所以我编写了以下量角器代码 var canvas element by id canvas var clickCanvas function toRight toBottom browser actio
  • ExitFullScreen 不起作用 + 无论如何要按键盘单击按钮?

    我的浏览器 Google Chrome 版本 33 0 1750 154 m Script function exitFullscreen var element document documentElement if element mo
  • 如何处理 d3 中 Beeswarm 图中的碰撞?

    我一直在玩这个例子here https gf neocities org co2bs co2bee html一会儿 我想做的是突出显示图中的单个节点 圆圈 通过使用边框使其变大 稍后我也想在其中添加文本或字母 目前 我已经圈了Bhutan图
  • 使用什么事件来在选择文本框中的值时显示警报消息

    我正在使用 jquery 的自动完成 api 来从数据库中获取名称 但是我想在从显示的文本框中选择名称时显示一条警报消息 我将显示一个图像以便更好地理解 当我输入 S 时 它将显示所有包含 S 的记录 所以问题是 如果我选择例如 Spars
  • 从 JavaScript 将参数传递给 p:remoteCommand

    我想将值传递给remoteCommand来自 JavaScript 如果这是可能的 我该如何做到这一点以及如何在支持 bean 中接收它们 对的 这是可能的 如何执行此操作取决于 PrimeFaces 版本 你可以在PrimeFaces 用
  • Backbone.js 与 Google 地图 - 有关此问题和侦听器的问题

    我有一个为 Google Maps v3 创建的模块 我正在尝试将其转换为 Backbone js 视图构造函数 到目前为止 这是我的视图模块 我将解释代码后遇到的问题 pg views CreateMap Backbone View ex
  • 在js中检测浏览器的最佳方法

    JavaScript 中有很多浏览器检测方法 据我所知 使用navigator userAgent或检测特征 例如XMLHttpRequest 等等 谁能告诉我哪种方法最好 最有效 如果你真的需要知道什么browser他们正在使用 你主要需
  • 从 url 角度加载模板并在 div 内编译

    由于我是 Angular JS 的新手 我想知道如何加载外部模板并将其与一些数据一起编译到目标中div 例如我有这个模板
  • 如何中和 CSS 定义而不覆盖

    有没有一种方法可以中和元素的 CSS 规则而不覆盖所有内容 例如 我正在使用 Twitter Bootstrap 它有许多预定义的 CSS 定义table 在某些地方 我不想要它们 对某些table元素 我想知道我是否可以做这样的事情 ta
  • 以编程方式触发 highchart 散点图上某个点的单击事件

    实际上 我有一个小要求 其中有一个带有点列表和下拉列表的散点图 当我从下拉列表中选择一个项目时 应触发其相应的数据点单击 当我在图表上选择一个数据点时 必须执行一些操作 并且下拉列表应根据选择进行更新 我们有什么办法可以做到这一点吗 我尝试
  • 您网站上的自定义 jQuery 脚本有多少行代码?多少才算是太多呢?

    对于我们的网站 我使用了大量 jQuery 现在我正在查看基础库顶部的 340 行 jQuery 代码 多少是太多了 我将添加更多内容 我什么时候开始尝试压缩代码并最终转向 OOP 行数并不意味着什么 重要的是你实际上在做什么 您可能拥有
  • 未处理的承诺拒绝:Zone.js 检测到 ZoneAwarePromise `(window|global).Promise` 已被覆盖

    我尝试将 Angular2 快速入门代码合并到我当前的 webpack 构建中 似乎有些东西正在覆盖zone js抛出此错误的承诺 根据我见过的大多数 stackoverflow 帖子 zone js文件需要在任何可能包含承诺的文件之后加载
  • SVG 剪辑路径在 Safari 上不起作用

    我有一个简单的动画 从下往上填充 svg 然后淡出 填充是使用clipPath随着使用path with a stroke dasharray stroke dashoffset 问题是clipPath在 Safari 上似乎完全被忽略了
  • 在部分渲染时执行 JavaScript

    我有一些 JavaScript 代码 我想在用户单击其文件夹之一后执行 它会触发 show 操作和 show js erb 从而呈 现部分内容 Show js erb 当用户单击其文件夹之一时触发 如下所示 body append 它成功注
  • 如何修复带有单个道具的括号的 prettier 和 tslint 错误?

    我使用 prettier 和 tslint https github com alexjoverm tslint config prettier https github com alexjoverm tslint config prett
  • 使用 Javascript 检测 Pepper (PPAPI) Flash

    我们使用的是专有的文档查看器 它与某些 Chrome 版本中的 Pepper 版本的 Flash 配合得不太好 所以我希望能够检测到它并重定向到不同格式的相同内容 由于这个版本似乎落后于 NPAPI 版本 所以我一直在使用闪光检测 http
  • 如何更改 div 悬停时的跨度颜色

    我正在尝试更改 div 悬停时跨度的颜色 如何使红色汉堡按钮 即跨度 在 div 悬停时将颜色更改为黑色 PS 现在它在跨度的悬停上执行此操作 JSFiddle https jsfiddle net bjjbqct8 https jsfid
  • 当td内容太宽时,表格溢出父div

    我准备了一个 JSFiddle 来解释 向你展示我的问题 http jsfiddle net nz96C http jsfiddle net nz96C 乍一看还不错 但是当我添加一些文本时 firsttd一旦使用 tds 整个宽度 整个表
  • 两个 div 之间的匿名空白

    这里是Fiddle http jsfiddle net y6hSV 1 我有两个divs一个用于标题 另一个用于主体 在 的里面div这是标题 我还有另一个div那个 div 是floated left 因为那个floating 两者之间出
  • 将日期参数传递给对 MVC 操作的 ajax 调用的安全方法

    我有一个 MVC 操作 它的参数之一是DateTime如果我通过 17 07 2012 它会抛出一个异常 指出参数为空但不能有空值 但如果我通过01 07 2012它被解析为Jan 07 2012 我将日期传递给 ajax 调用DD MM

随机推荐

  • Linux--多线程(1)

    目录 一 概念 二 理解 三 创建 退出 合并进程 man pthread create Compile and link with pthread 1 为什么没有fun函数 2 加上sleep来改进 3 线程结束会不会影响主线程运行 4
  • Java应用调试利器——BTrace教程

    http www jianshu com p 26f19095d396 背景 生产环境中可能出现各种问题 但是这些问题又不是程序error导致的 可能是逻辑性错误 这时候需要获取程序运行时的数据信息 如方法参数 返回值来定位问题 通过传统的
  • ZRANGEBYSCORE

    ZRANGEBYSCORE key min max WITHSCORES LIMIT offset count 返回有序集 key 中 所有 score 值介于 min 和 max 之间 包括等于 min 或 max 的成员 有序集成员按
  • Python Tkinter详解 (四)文本输入框的使用

    同样的 我们先创建出一个最最最最最简单的输入框 我们在进行信息交互的时候 会经常使用输入框为我们的系统键入信息 那么他又有哪些属性呢 import tkinter as tk window tk Tk tk Entry window wid
  • STM32 基础系列教程 20 - RTC

    前言 学习stm32 RTC 实时时钟 的使用 学会用RTC实现钟表功能 示例详解 基于硬件平台 STM32F10C8T6最小系统板 MCU 的型号是 STM32F103c8t6 使用stm32cubemx 工具自动产生的配置工程 使用KE
  • 二叉树的相关列题!!

    对于二叉树 很难 很难 笔者也是感觉很难 虽然能听懂课程 但是 对于大部分的练习题并不能做出来 所以感觉很尴尬 因此 笔者经过先前的那篇博客 已经开启了大脑奇迹 现在还热乎着 刚刚的更文 二叉树讲解https blog csdn net w
  • OC学习篇之---类的延展

    前一篇文章我们介绍了类的类目概念和使用 http blog csdn net jiangwei0910410003 article details 41775329 那么这篇文章我们继续来介绍一下OC中的一个特性 延展 其实说白了 延展就是
  • 有关EMQX桥接的配置工作

    前言 桥接是一种连接多个 EMQ X 或者其他 MQTT 消息中间件的方式 不同于集群 工作在桥接模式下的节点之间不会复制主题树和路由表 桥接模式所做的是 按照规则把消息转发至桥接节点 从桥接节点订阅主题 并在收到消息后在本节点 集群中转发
  • Unity - 微信小游戏

    总参考 Unity WebGL 微信小游戏适配方案 公测 安装与使用 下载 Unity插件 并导入至游戏项目中 版本更新请查看更新日志 请查阅推荐引擎版本 安装时选择WebGL组件 最终选择Unity2021 2 5f1c1InstantG
  • 实战项目:图书管理系统介绍

    本文详细的介绍了实战项目之一的图书管理系统 下载后可以直接使用 也可以直接用于毕业设计 本系统前端使用的框架是vue2 elementUI 后端使用的框架为springboot mybatis maven 数据库使用的是myql数据库 安全
  • 【我不知道的css】巧用flex:0实现上方图片下方文字效果

    我不知道的css 巧用flex 0实现上方图片下方文字效果 要求 代码 原理 要求 要求使用flex布局实现下图所示的效果 容器内部左边为图片和文字 图片在上 文字在下 图片大小不一 文字长度不一 但要求文字根据图片的宽度自动换行 代码 d
  • java mysql教程基于_SpringBoot入门教程(五)Java基于MySQL实现附近的人

    附近的人 这个功能估计都不陌生 与之类似的功能最开始是在各大地图应用上接触过 比如搜附近的电影院 附近的超市等等 然而真正让附近的人火遍大江南北的应该是微信 附近的人 这个功能 记得微信刚出的时候 坊间还有一句 寂寞女聊玩微信 寂寞男人搜附
  • spring security 入门与理解

    1 pom加载
  • seo积分排名系统源码_SEO快速排名系统操作手法以及细节

    SEO快速排名是目前我国SEO行业最热门的话题之一 总之 所有的快速行都可以用两个词来解释 那就是点击 任何行业 包括SEO 都可以使用的原因也是一样的 例如 目前我国有大量的快速排序系统 这种快速排序系统由于百度的雷声算法而受到不同程度的
  • 使用阿里云服务器安装宝塔面板搭建网站教程(图文全流程)

    阿里云服务器安装宝塔面板教程 云服务器吧以阿里云Linux系统云服务器安装宝塔Linux面板为例 先配置云服务器安全组开放宝塔所需端口8888 888 80 443 20和21端口 然后执行安装宝塔面板命令脚本 最后登录宝塔后台安装LNMP
  • 6 款 超好用的 Python 时间库

    开源最前线 ID OpenSourceTop 链接 https opensource com article 18 4 python datetime libraries 写过Python程序的人都知道 Python日期和时间的处理非常繁琐
  • TIDB 详解

    TIDB是什么 TIDB 受谷歌Spanner和F1的论文启发的new sql数据库 这类数据库不仅具有NoSQL对海量数据的存储管理能力 还保持了传统数据库支持ACID和SQL等特性 同类数据库还包括巨杉数据库 TiDB的原理与实现 Ti
  • 嵌入式web服务器Boa的移植

    Boa是一种非常小巧的Web服务器 其可执行代码只有大约60KB左右 作为一种单任务Web服务器 Boa只能依次完成用户的请求 而不会fork出新的进程来处理并发连接请求 但Boa支持CGI 能够为CGI程序fork出一个进程来执行 Boa
  • 考研数据结构--第二章:线性表

    系列索引 2023考研王道数据结构知识梳理 文章目录 1 线性表 1 1 线性表定义 1 2 线性表的特点 1 3 线性表的基本操作 2 顺序表 2 1 顺序表的定义 2 2 顺序表的实现 2 2 1 顺序表的静态分配 2 2 1 1 局限
  • Div点击显示再次点击隐藏

    1 先上效果 这是默认显示的时候 这是再点击隐藏的时候 下方代码贴出 有需要的C V直接浏览器查看