如何在 jQuery 中使用 hide() 方法？(1)

📌 相关文章

📜 如何在 jQuery 中使用 hide() 方法？(1)

📅 最后修改于: 2023-12-03 15:38:18.252000 🧑 作者: Mango

如何在 jQuery 中使用 hide() 方法？

jQuery 的 hide() 方法可以用来隐藏 HTML 元素。它是一个快捷方法，可以用来设置元素的 display 属性为 none。

使用方法

可以通过以下两种方式使用 hide() 方法：

1. 隐藏单个元素

直接在 jQuery 对象后调用 hide() 方法即可隐藏该元素。

$(selector).hide();

2. 隐藏多个元素

可以通过传递一个时间参数来隐藏多个元素。

$(selector).hide(speed,callback);

其中，speed 表示隐藏动画的速度（可以取以下字符串值：slow、fast 或毫秒数），callback 是当隐藏完成后所执行的回调函数。

例子

以下是一个简单的例子，演示如何在 HTML 页面中使用 hide() 方法来隐藏一个 div 元素：

<!DOCTYPE html>
<html>
<head>
	<title>Using jQuery hide() method</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
	<script>
		$(document).ready(function(){
			$("#hideButton").click(function(){
				$("#hideText").hide();
			});
		});
	</script>
</head>
<body>

<div id="hideText">
  <h2>Hide Me</h2>
  <p>Hello World!</p>
</div>

<button id="hideButton">Hide the text</button>

</body>
</html>

当点击按钮时，会隐藏 id 为 hideText 的 div 元素。

总结

jQuery 的 hide() 方法是一个非常方便的函数，用于在网页中隐藏元素。无论是单个元素还是多个元素，都能够轻松实现隐藏效果。同时，通过设置隐藏速度和回调函数，也可以实现更加复杂的隐藏动画效果。