jQuery의 height() 및 width()가 숨겨진 요소에 대한 값을 반환하는 이유는 무엇입니까?

jQuery: 숨겨진 요소 및 차원 속성

일반적인 가정과 달리 display:none이 있는 요소는 jQuery 높이에 대해 항상 0을 반환하지 않습니다. () 및 width() 메서드. 이러한 기대치와의 차이는 프로그래머들 사이에서 지속적인 혼란의 대상이 되어 왔습니다.

Unveiling the Mystery

이 불일치는 jQuery가 display:none 스타일로 요소를 처리하는 방식에서 발생합니다. . 요소의 오프셋 너비가 0(효과적으로 숨겨져 있음을 나타냄)이면 jQuery는 내부 계산을 사용하여 높이를 결정하려고 시도합니다.

1. 임시 변환: 요소의 너비를 일시적으로 수정합니다. jQuery.swap()을 사용하는 CSS 속성:

   • 위치를 "절대"로 설정
   • 가시성을 "숨김"으로 설정
   • 표시를 "차단"으로 설정
2. 높이 측정: 이러한 변경으로 getWidthOrHeight(...)를 사용하여 높이를 얻습니다.
3. 속성 복원: 마지막으로 CSS 속성을 이전 값으로 되돌려 요소를 효과적으로 다시 숨깁니다.

이 전체 프로세스는 UI 스레드가 업데이트되기 전에 원활하게 발생하여 해당 크기를 검색하는 동안 요소의 숨겨진 상태를 유지합니다. height() 및 width()를 통해 display:none 요소에 액세스할 수 있도록 함으로써 jQuery는 해당 크기와 관련된 계산이 가시성 상태에 관계없이 수행될 수 있도록 보장합니다.

위 내용은 jQuery의 height() 및 width()가 숨겨진 요소에 대한 값을 반환하는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!