>웹 프론트엔드 >CSS 튜토리얼 >jQuery를 사용하여 숨겨진 요소의 높이를 어떻게 효율적으로 얻을 수 있습니까?

jQuery를 사용하여 숨겨진 요소의 높이를 어떻게 효율적으로 얻을 수 있습니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-12-22 04:24:13962검색

How Can I Efficiently Get the Height of a Hidden Element Using jQuery?

jQuery로 숨겨진 요소의 높이 얻기

숨겨진 상위 div 내에 숨겨진 요소의 높이를 결정하는 것은 어려울 수 있습니다. 높이를 얻기 위해 요소를 일시적으로 공개한 다음 다시 숨기는 것은 비효율적입니다. 더 최적의 솔루션은 다음과 같습니다.

해결책:

다음 코드 조각을 사용할 수 있습니다.

var previousCss = $("#myDiv").attr("style");

$("#myDiv").css({
    position:   'absolute', // Optional if #myDiv is already absolute
    visibility: 'hidden',
    display:    'block'
});

optionHeight = $("#myDiv").height();

$("#myDiv").attr("style", previousCss ? previousCss : "");

설명:

  1. 현재 CSS 스타일 저장 이전Css 변수에 있는 div의
  2. 위치를 절대(이미 절대인 경우 선택 사항)로, 가시성을 숨김으로, 표시를 차단으로 설정하여 div의 CSS를 조정합니다.
  3. 높이를 가져옵니다. 현재 표시되는 div를 선택하고 optionHeight 변수에 저장합니다.
  4. 다음 경우 div의 이전 CSS 스타일을 복원하거나 인라인 스타일을 제거합니다. PreviousCss가 비어 있습니다.

이 접근 방식을 사용하면 상위 div를 표시하거나 숨길 필요가 없으므로 숨겨진 요소의 높이를 얻는 더 효율적인 방법이 됩니다.

위 내용은 jQuery를 사용하여 숨겨진 요소의 높이를 어떻게 효율적으로 얻을 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.