jquery怎么让div不占位隐藏
时间:2021-11-30 来源:互联网
今天PHP爱好者为您带来jquery让div不占位隐藏的方法:1、使用“$("div").css('display','none');”语句;2、使用“$("div").hide();”语句;3、使用“$("div").toggle();”语句。希望对大家有所帮助。
本教程操作环境:windows7系统、jquery1.10.2版本、Dell G3电脑。
jquery让p不占位隐藏
要让p不占位隐藏,就会想到给p设置display:none
样式。
display:none
可以不占据空间,把元素隐藏起来,所以动态改变此属性时会引起重排(改变页面布局),可以理解成在页面中把该元素删除掉一样;不会被子孙继承,但是其子孙是不会显示的,毕竟都一起被隐藏了。
那么如何使用jquery给p设置display:none
样式?下面给大家介绍一下:
方法一:使用css()添加display:none样式
$("p").css('display','none');
示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="js/jquery-1.10.2.min.js">
</script>
<script>
$(document).ready(function() {
$("button").click(function() {
$("p").css('display', 'none');
});
});
</script>
</head>
<body>
<p style="border: 1px solid red;">hello</p>
<br>
<button>点击按钮,让p不占位隐藏</button>
</body>
</html>
方法二:使用hide() 方法
$("p").hide();
hide()方法可以隐藏元素,原理就是给元素添加display:none样式
方法三:使用toggle()方法
$("p").toggle();
toggle(方法检查被选元素的可见状态。如果一个元素是隐藏的,则运行 show()隐藏元素,如果一个元素是可见的,则运行 hide()显示元素 - 这会造成一种切换的效果。
相关教程以上就是jquery怎么让p不占位隐藏的详细内容,更多请关注php爱好者其它相关文章!
-
米姆米姆哈如何完成二级灵感花灯-花庭工作站注意事项 2025-09-17
-
和平精英高校主理人招募开始-瓜分250W+激励金 2025-09-17
-
百度文章发布全攻略:快速掌握正确方法与优化技巧 2025-09-17
-
当当网购书全攻略:步骤详解与优惠技巧轻松省钱购好书 2025-09-17
-
无限暖暖音乐季九月下巅峰赛-奇迹之冠第五到八关 2025-09-17
-
王者荣耀十周年S41赛季以天元为题-邀你共赴荣耀 2025-09-17