document.getElementById null이 있거나 거기에 있고로드 된 후에도 작동하지 않습니다.

JavaScript에 대한 이해가 매우 부족합니다. 두 개의 div를 높이의 높이를 기준으로 동일한 높이로 만들고 싶습니다. (그리고 컨테이너를 확장하여이 부분을 먼저 만들어야합니다.) 나는 CSS로 찾을 수있는 모든 것을 시도했으며 IE7에서만 문제가 존재합니다.document.getElementById null이 있거나 거기에 있고로드 된 후에도 작동하지 않습니다.

처음에는 콘텐츠 및 사이드 바를위한 document.getElementById (한 번에 하나씩 만 시도 했음)가 null이라고 알려주었습니다. 내가 그것에 대해 찾을 수있는 것은 페이지가 물리적으로 내용을 배치하거나 window.onload를 사용하여로드 한 후에 있어야한다는 것입니다. 그런 다음 다양한 조합을 시도한 다음 이름없는 함수, 명명 된 함수, onclick에 의해 트리거 된 함수 또는 onmouseover하지만 여전히 아무 일도 일어나지 않습니다.

마찬가지로 더 이상 null 오류를 표시하지 않지만 아무 일도 발생하지 않으며 오류가 발생하지 않습니다.

여기에 누락 된 것이 있습니까?

<body> 
<div id="contentwrapper" role="presentation"> 
     <div id="content" role="main"> 
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc consectetur, risus vitae ultrices pellentesque, urna massa semper purus, a rutrum neque nunc venenatis tortor. Suspendisse viverra tortor eget nisl elementum scelerisque id id tortor. Vestibulum quis mi non purus gravida tincidunt sed sed elit. Phasellus iaculis commodo erat, pellentesque egestas lectus feugiat non. Maecenas nulla neque, semper vel sem sed, volutpat venenatis ipsum.</p> 
</div> 

     <div id="sidebar" role="main"> 
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc consectetur, risus vitae ultrices pellentesque, urna massa semper purus, a rutrum neque nunc venenatis tortor.</p> 
</div> 
</div> 


<script type="text/javascript"> 
window.onload = function(){ 
    var contentheight = document.getElementById("content").clientHeight; 
    var sidebarheight = document.getElementById("sidebar").clientHeight; 


    /*if(contentheight != sidebarheight) { 
     if(sidebarheight > contentheight) { 
      document.getElementById("content").style.height = sidebarheight; 
     }else{*/ 
      document.getElementById("sidebar").style.height = contentheight; 
     /* } 
    } 
}*/ 
} 
</script> 
</body>

또한

그것은에 어떤 영향을 경우에 CSS (그리고 그래, 그 대부분은 그냥 얻으려고 있기 때문에 뭔가을 할 주석) :

#contentwrapper { 
    width: 500px; 
    border: 1px solid black; 
    height: 100%; 
    background: #DDF; 
    position: relative; 
} 

#content { 
    width: 300px; 
    display: block; 
    background: #FDD; 
    display: inline; 
    position: absolute; 
    left: 0; 
} 

#sidebar { 
    width: 200px; 
    display: block; 
    background: #DFD; 
    display: inline; 
    position: absolute; 
    right: 0; 
}

출처

2014-04-07 qwigoqwaga

아마도 'contentheight +'px''로 설정해보십시오. – guest

고쳐 준 것 같습니다. 고마워요! 나는 그것을 시도했는지 안했는지 기억할 수 없었다. 명백하게. – qwigoqwaga

이 질문이 해결 된 것으로 보입니다. 그걸로 표시 할 수 있니? – Sunyatasattva

clientHeight property은 높이를 픽셀 단위로 나타내는 정수입니다. 스타일 속성은 측정의 연결 장치없이 숫자의 의미가 없다, 그래서 당신은에 그것을 추가 할 필요가

가 원치 않는 의견

if(contentheight != sidebarheight) { 
    if(sidebarheight > contentheight) { 
     document.getElementById("content").style.height = sidebarheight + 'px'; 
    } else { 
     document.getElementById("sidebar").style.height = contentheight + 'px'; 
    } 
}

_{:. (그건 그렇고, 행동의 높이를 가져 오는 동안 것은 중 하나입니다 가장 일반적인 CSS 문제는, 당신이 열심히 노력한다면, 당신이 찾고있는 것을 달성하기 위해 비 js 방법을 찾아야한다고 확신합니다. 문제가 IE7 - 당신이 아마도 지원을 포기해야하는 8 년 된 브라우저 -}

출처

2014-04-07 02:08:08 Sunyatasattva

document.getElementById null이 있거나 거기에 있고로드 된 후에도 작동하지 않습니다.

답변

관련 문제