Firefox가 offsetHeight를 사용하여 div의 높이(0)를 얻는 문제를 해결하는 방법
- 不言원래의
- 2018-06-21 16:33:502258검색
Firefox가 p의 높이를 얻어야 할 때, offsetHeight를 사용해야 하는 경우가 있습니다. 때로는 offsetHeight가 0으로 얻어지는 경우도 있습니다. 관심 있는 친구들은 다음을 참조할 수 있습니다.
Firefox에서 필요할 때 p의 높이를 얻으려면 offsetHeight를 사용해야 하는 경우가 많습니다. 때로는 offsetHeight가 0이 되는 현상이 발생할 수 있습니다.
IE 또는 Firefox를 사용할 때, 특히 현재 p+css 방법에서는 p의 높이가 정의되지 않는 경우가 많습니다. 이때 p개의 콘텐츠를 추가한 후 p의 높이를 구해야 할 때, offsetHeight를 사용해야 하는 경우가 많습니다.
사용하다 보면 offsetHeight가 0으로 얻어지는 현상이 가끔 발생하는데, 다양한 JS 디버깅 도구를 사용하여 디버깅을 하면 객체에 값이 보이는 것을 볼 수 있습니다(offsetHeight를 직접 가리키면 쓸모가 없지만, 만약 객체 뷰에 값이 있습니다. 디버거에서 객체를 보기 위해 Enter를 누르면 객체가 새로 고쳐져서 값을 갖게 됩니다.)
예를 들어 다음 프래그먼트
코드는 다음과 같습니다. :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script language='javascript'>
window.attachEvent( "onload", function(){ _resizeScroll2();} );
window.onresize=function(){winresize();};
function _resizeScroll2(){
var html1 = '<p id="pcj" style="margin-top:15px;font-size:10px;width:400px;">'
+ '<p style="float:left;width:50px;">测试</p>'
+ '<p style="float:left;width:320px;">danielinbiti</p>'
+ '</p>'
+ '<p id="pcj2" style="margin-top:15px;font-size:10px;width:400px;">'
+ '<p style="width:320px;">danielinbiti</p>'
+ '</p>'
document.getElementById('outer').innerHTML=html1;
document.getElementById('pcj2').style.display='none';
alert(document.getElementById('pcj2').offsetHeight);
}
</script>
</head>
<body>
<p id='outer'></p>
</body>
</html>pcj의 높이를 얻으면 onload에 도착합니다. pcj 아래에 float 레이아웃이 있기 때문입니다.
이때 p가 단순하다면 여기에서 pcj2와 같은 숨겨진 레이어를 사용할 수 있습니다. float를 제거하면 얻은 높이가 pcj만큼 높아집니다.
여기서 중요한 점은 IE에서는 float 레이아웃이 괜찮지만 Firefox에서는 0이라는 것입니다.
위는 이 기사의 전체 내용입니다. 모든 사람의 학습에 도움이 되기를 바랍니다. 관련 항목에 더 관심을 가져주세요. 내용 PHP 중국어 웹사이트!
관련 권장 사항:
HTML5에서 비디오 태그의 브라우저 호환성을 향상하기 위한 솔루션 공유
위 내용은 Firefox가 offsetHeight를 사용하여 div의 높이(0)를 얻는 문제를 해결하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!