html中实现数据的显示和隐藏
时间:2017-11-22 16:18:18|栏目:HTML/Xhtml|点击: 次
<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<title>demo</title>
<script>
var obj = document.getElementById("div_id");
function hideOrShowEvent(){
var obj= document.getElementById("div_id");
if(obj.style.display=="block"){ //如果是显示则隐藏
obj.style.display="none";
}else{ //如果是隐藏则显示
obj.style.display="block";
}
}
</script>
</head>
<body>
<div id="div_id" style="border:1px solid red;display:block;" > 这里是内容 </div>
<button type="button" onclick=hideOrShowEvent()> 点击隐藏或显示 </button>
</body>
</html>
|
栏 目:HTML/Xhtml
下一篇:超链接 a href 通过post方式提交表单的方法
本文标题:html中实现数据的显示和隐藏
本文地址:https://fushidao.cc/wangyezhizuo/6.html
您可能感兴趣的文章
- 02-19html中关于form与表单提交操作的资料集合
- 12-14html网页引入svg图片的4种方式
- 12-14HTML表格合并的具体实现方式
- 02-19HTML网页中插入视频的方法小结
- 02-19html转换为pdf案例的一些总结(多图推荐)
- 02-19快速解决input[type=file]打开时慢、卡顿的问题
- 02-19html 基于 canvas 实现的一个截图小demo
- 02-19在HTML中使用JavaScript实例代码
- 02-19HTML中表格动态添加_动力节点Java学院整理
- 02-19HTML中的5种空格各表示的意义