jquery가 요소 숨기기 또는 표시 효과를 구현하는 방법(코드 예)-JS 튜토리얼-php.cn

jquery가 요소 숨기기 또는 표시 효과를 구현하는 방법(코드 예)

青灯夜游

풀어 주다： 2018-10-20 14:08:25

원래의

4100명이 탐색했습니다.

jquery를 사용하여 요소를 숨기거나 표시하는 방법은 무엇입니까? 이 기사에서는 jquery에서 요소 숨기기 또는 표시를 설정하는 방법을 소개하여 요소 숨기기 및 표시 전환 효과를 얻는 방법을 이해할 수 있습니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

jquery에서 요소 숨기기 및 표시 효과를 구현하는 방법에는 다음 두 가지가 있습니다.

1 요소를 숨기고 표시하려면 hide() 및 show() 메서드를 사용하세요.

2 숨기려면 전환() 메서드를 사용하세요. and show elements

이 두 메소드가 요소 숨기기 및 표시를 어떻게 구현하는지 살펴보겠습니다.

hide() 및 show() 메소드는 요소 숨기기 및 표시를 구현합니다.

jquery의 hide() 메소드는 요소를 숨기는 데 사용됩니다.

jquery의 show() 메소드는 요소를 표시하는 데 사용됩니다.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<script type="text/javascript" src="jquery.min.js"></script>
		<script type="text/javascript">
		$(document).ready(function(){
		    $(".btn1").click(function(){
		        $("p").hide();
		    });
		    $(".btn2").click(function(){
		        $("p").show();
		    });
		});
		</script>
	</head>
	<body>
		<p>这是一段测试文字。</p>
		<button class="btn1">Hide--隐藏</button>
		<button class="btn2">Show--显示</button>
	</body>

</html>

로그인 후 복사

Rendering:

jquery가 요소 숨기기 또는 표시 효과를 구현하는 방법(코드 예)

숨기기 버튼을 클릭하면 hide() 메소드를 사용하여 요소를 숨길 수 있습니다.

jquery가 요소 숨기기 또는 표시 효과를 구현하는 방법(코드 예)

표시 버튼을 클릭하면 show() 메소드를 사용하여 숨겨진 요소를 표시할 수 있습니다.

jquery가 요소 숨기기 또는 표시 효과를 구현하는 방법(코드 예)

toggle() 메소드는 요소 숨기기 및 표시를 구현합니다(숨기기 또는 표시 전환).

toggle() 메소드는 요소의 표시 상태, 즉 요소 숨기기 또는 표시를 전환할 수 있습니다.

toggle() 메서드는 선택한 요소가 표시되는지 여부를 결정합니다. 선택한 요소가 숨겨져 있으면 해당 요소가 표시됩니다.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<script type="text/javascript" src="jquery.min.js"></script>
		<script type="text/javascript">
		$(document).ready(function(){
		    $(".btn").click(function(){
		        $("p").toggle();
		});
		</script>
	</head>
	<body>
		<p>这是一段测试文字。</p>
		<button class="btn">toggle()</button>
	</body>
</html>

로그인 후 복사

렌더링:

jquery가 요소 숨기기 또는 표시 효과를 구현하는 방법(코드 예)

참고: jquery 메서드를 사용할 때 hide(), show(),ggle() 또는 기타 메서드인지 여부에 관계없이 먼저 jquery.js 파일을 참조해야 합니다.

요약: 위 내용은 요소 숨기기 또는 표시 효과를 구현하기 위한 jquery의 전체 내용입니다. 코드는 매우 간단하며 비용을 들여 직접 시도해 볼 수 있습니다. 더 많은 관련 튜토리얼을 보려면 jQuery Video Tutorial, JavaScript Video Tutorial, bootstrap Video Tutorial을 방문하세요.

위 내용은 jquery가 요소 숨기기 또는 표시 효과를 구현하는 방법(코드 예)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!