Jquery에서 범위 요소를 숨기는 방법(세 가지 방법)

웹 디자인에서 jQuery는 동적 효과를 얻기 위해 자주 사용됩니다. 그중에서도 요소의 표시 및 숨기기를 제어하는 ​​것도 일반적인 요구 사항입니다. jQuery는 범위 요소를 숨기는 다양한 방법을 제공하며 이 기사에서는 그 중 일부를 소개합니다.

1. hide() 메소드를 사용하세요

jQuery의 hide() 메소드는 지정된 요소를 숨길 수 있습니다.

$(selector).hide();

여기서 selector는 숨길 요소의 선택자입니다. 이 메소드가 호출되면 요소가 숨겨집니다. 범위 요소를 숨기려면 다음 코드를 사용하면 됩니다.

$("span").hide();

여기서 선택기는 "span"입니다. 이는 페이지의 모든 범위 요소를 선택하고 숨긴다는 의미입니다. 동일한 페이지에 여러 개의 범위 요소가 있는 경우 이 방법은 모든 범위 요소를 동시에 숨깁니다.

2. CSS 메서드 사용

CSS 메서드를 사용하여 요소 표시 및 숨기기를 제어할 수도 있습니다.

$(selector).css("display", "none");

그중에서 숨겨야 할 요소를 선택하는 것이 선택자입니다. "display"는 설정할 CSS 속성 이름이고, "none"은 설정할 속성 값입니다. 이 코드가 실행되면 요소가 숨겨집니다. 범위 요소를 숨기려면 다음 코드를 사용할 수 있습니다.

$("span").css("display", "none");

여기서 선택기는 여전히 "span"입니다. 이는 모든 범위 요소에 적용된다는 의미입니다.

이 방법을 사용할 때 참고: 요소에 원래 CSS 스타일 시트에 정의된 "표시" 속성이 있는 경우 이 방법은 원래 스타일을 덮어씁니다.

3.toggle() 메소드를 사용하세요.

toggle() 메소드는 요소의 표시 및 숨기기를 제어하기 위해 jQuery에서 제공하는 함수입니다. 전달된 매개변수가 true이면 지정된 요소가 숨겨지고, 전달된 매개변수가 false이면 해당 요소가 표시됩니다.

$(selector).toggle(true/false);

여기서 선택자는 숨기거나 표시할 요소의 선택자를 나타냅니다. 범위 요소를 숨기려면 다음 코드를 사용할 수 있습니다.

$("span").toggle(true);

여기서 선택기는 여전히 "span"입니다.

요소 자체가 숨겨져 있으면 요소가 표시되고, 요소 자체가 표시되면 요소가 숨겨집니다.

toggle() 메서드는 true/false를 매개변수로 전달하는 것 외에도 다른 매개변수를 받아들일 수도 있습니다. 해당 용도는 다음 표에 나와 있습니다.

Parameters	Purpose
[duration]	애니메이션 속도를 지정합니다. 기본값은 "보통"입니다.
[콜백]	애니메이션이 완료된 후 실행할 함수를 지정합니다.
[queueName]	사용할 대기열의 이름(문자열)을 지정합니다.
[switchFlag]	true로 설정하면 요소가 원래 상태일 때만 애니메이션이 실행됩니다. 그렇지 않으면 애니메이션이 매번 실행됩니다.

예를 들어, 다음 코드를 사용하여 범위 요소를 숨길 수 있습니다.

$("span").toggle("slow");

여기서 "느린"은 애니메이션이 더 느리고 요소가 천천히 숨겨짐을 의미합니다.

4. 요약

이 문서에서는 hide(), CSS 및 Toggle() 메서드를 사용하여 범위 요소를 숨기는 세 가지 방법을 소개합니다. 실제 개발에서는 실제 요구에 따라 가장 적합한 방법을 선택해야 합니다. 어떤 방법을 사용하든 jQuery를 통해 요소를 쉽게 표시하고 숨길 수 있습니다.

위 내용은 Jquery에서 범위 요소를 숨기는 방법(세 가지 방법)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!