html中实现数据的显示和隐藏

时间：2017-06-17|栏目：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>

(资源库 www.zyku.net)

上一篇：HTML/CSS：div居中和div内部元素垂直居中

栏目：HTML/Xhtml

下一篇：Textarea输入字数限制实例(兼容iOS&安卓)

本文标题：html中实现数据的显示和隐藏

本文地址：https://www.zyku.net/xhtml/1410.html

更多互联网推荐教程

HTML/Xhtml

html中实现数据的显示和隐藏

您可能感兴趣的文章

阅读排行

推荐教程