让元素消失的方法与区别

一、方法

1.visibility：hidden

2.display：none

3.z-index: -1

4.opacity: 0

二、区别

1.opacity：0，该元素隐藏起来了，但不会改变页面布局，并且，如果该元素已经绑定一些事件，如click事件，那么点击该区域，也能触发点击事件的
2.visibility：hidden，该元素隐藏起来了，但不会改变页面布局，但是不会触发该元素已经绑定的事件
3.display：none，把元素隐藏起来，并且会改变页面布局，可以理解成在页面中把该元素删除掉。