教你html怎么实现展开收起功能

来源：互联网 2023-03-16 19:19:28 版权归原作者所有，如有侵权，请联系我们

今天小编跟大家分享html中的展开收起功能，这个看着效果挺不错的，其实对于代码的实现并不复杂。

工具/原料

html基础知识

方法/步骤

首先来说说需要的效果，就像大家平时上网看到的那样，需要点击展开就展开信息，点击收起就收起信息。

教你html怎么实现展开收起功能？

当然也可以做成，点击一个div隐藏另外一个div的情况。

教你html怎么实现展开收起功能？

具体怎么实现呢？先在桌面上新建一个txt文件，文件中写入如下代码：

scripttype="text/javascript">

functionelementDisplay(objid){varobj=document.getElementById(objid);if(obj.style.visibility!='hidden'){obj.style.visibility='hidden';}else{obj.style.visibility='visible';}}/script>divonclick="elementDisplay('shishi')">你可以点击一下试试了/div>divid="shishi"style="background-color:#000000;width:100px;left:100px;height:100px;position:absolute;">/div>

教你html怎么实现展开收起功能？