在前端中隐藏一个元素的几种方法与注意事项

首页 » 教程资料 » 2020年06月09日晚上 10:47:39 » 本文：1609字
  • A

    选择打赏方式

在日常开发中发现，关于隐藏一个div或其他的元素的需求还蛮多的，所以就打算总结一下几种隐藏方法：

1.CSS display属性 

dispaly: none;

2.CSS visibility属性 

visibility: hidden;

3.CSS opacity属性 

opacity: 0;

4.表单元素type类型为隐藏 

<input type="hidden" value="阅客网">

5.原生JS设置visibility属性 

document.getElementById("idname").style.visibility="hidden";//隐藏
document.getElementById("idname").style.visibility="visible";//显示

6.原生JS设置display属性 

document.getElementById("idname").style.display="none";//隐藏
document.getElementById("idname").style.display="inline";//显示

7.Jquery方法 

$("selector").hide();//隐藏
$("selector").show();//显示

8.当宽度和高度都设置为0时，这个元素是不显示的

9.当一个父元素是隐藏的，子元素也会跟着隐藏

通过visibility和opacity隐藏元素之后，仍会占用空间，显示出空白区域；而其他的方法均不会占用原来的空间位置

本文标签：HTML
版权声明：若无特殊注明，本文为《傲世》原创，转载请保留文章出处。
本文链接：https://www.recho.cn/154.html
如您对本文章内容有所疑问、反馈或补充，欢迎通过邮箱：admin@h2fast.cn 联系我们！
正文到此结束

热门推荐