2010-12-11 2 views
0

기본적으로 element1.style.display='none' 페이지를 만들었습니다. 이제 다른 요소 인 element2을 클릭하면 element1이 표시됩니다. 그러나 element1element1.style.display="block"으로 설정하는 함수로 설정하려고하면 element1이 null이라는 오류가 발생합니다. 나는 이것이 기본적으로 display=none이기 때문에 이것을 이해합니다.Null 요소 javascript with display : 없음

이 문제를 어떻게 해결할 수 있습니까? 이것은 jquery가 아닌 javascript를 사용하고 있습니다. 숨겨진 요소는 같은 순서로 항상 경우

var hash = location.hash; 
alert(hash); 

function init() { 
    if(hash == '#menu-a' || hash == '') { 
     document.getElementById('menu-a').style.display = 'block'; 
    } 
    else if(hash == '#menu-b') { 
     document.getElementById('menu-b').style.display = 'block'; 
    } 
    else { 
     document.getElementById('menu-c').style.display = 'block'; 
    } 
} 

window.onload=init; 
+1

문제는'style.display'와 관련이 없지만 당신을 돕기 위해서는 코드의 관련 부분을 게시해야합니다. –

+0

나는 인간의 음성 코드를 좋아합니다. 나는 실제 코드를 더 좋아한다. 코드 샘플을 제공해 주시겠습니까? –

+0

코드를 게시 할 수 있습니까? 디스플레이 스타일이 없음으로 설정되어 있기 때문에 오류가 발생하지 않습니다. 스타일 속성 때문에 요소가 null로 표시되지 않습니다. 뭔가 다른 일이 있습니다. – charliegriefer

답변

0

당신은 getElementsByTagName ("") arrayindex]로 접근 시도 할 수 있습니다.

+0

요소에 대한 참조가 충분해야합니다. 대부분의 경우 범위 문제이며 'element1'은 액세스하려는 곳에서 볼 수 없습니다. 그러나 코드가 없다면 실제로 이것에 대해 말할 수있는 것은 아무 것도 없습니다 (더 나은 해결책은 요소에 ID를주고'getElementById'를 사용하는 것입니다). –

+0

tl; dr 버전 : 올바른 envoirenment의 getElementById가 가장 좋은 해결책입니다. 당신 말이 맞아요. 전체 설명 : 코드가 제공되지 않았으므로 모든 요소가 올바르게 처리되고 getElementById가 여전히 작동하지 않는다고 가정했습니다. 물론 getElementById가 최상의 솔루션이지만이 문제를 미적으로 해결하려고하는 간단한 해결책을 제공하기를 원했기 때문에 더 적은 압력으로 작업 할 수있었습니다. – Cadoc

+0

다음은 var hash = location.hash 코드입니다. 알림 (해시); function init() { if (hash == '# menu-a'|| 해시 == ') { document.getElementById ('menu-a '). style.display ='block '; } else if (hash == '# menu-b') { document.getElementById ('menu-b'). style.display = 'block'; } else { document.getElementById ('menu-c'). style.display = '블록'; } } window.onload = init; –

0

DOM을 준비하기 전에 자바 스크립트를 트리거 할 수 있습니까? element1 DOM 트리에 액세스하려는 순간에 DOM 트리에 존재합니까?

+0

댓글이어야합니다. –

1

나는이 이해하기 때문에 디스플레이 = 기본 아무 것도 변수에 할당되지 않은 때문입니다

호에 의해 없음.

id="element1" 인 요소가 자동으로 element1이라는 JavaScript 변수를 생성 할 것으로 예상됩니다. 그럴 필요는 없습니다. 당신은 element가 초기화 될 때 곧 display:block을 수행 한 후 바로 초기화 후 display:none로 복귀한다

document.getElementById('element1').style.display = 'block'; 
0

나는 모든 브라우저가 동일한 방법으로 display:none (또는 적어도 그들의 자녀들)이있는 요소를 취급하는 것은 아닙니다. 나는 두 개의 DIV에 배치 된 SVG Objects를 가지고 있는데, 둘 중 하나를 보여주고 싶다. 초기화하는 동안 SVG 요소 (SVG 내부의 일부 텍스트 요소 변경)에 대한 조작을 수행합니다. 이것은 Firefox와 완벽하게 작동했지만 Opera, Chrome 및 IE에서는 실패했습니다. 이 브라우저에서 display:none의 div 안에있는 요소는 document.getElementById(myID)으로 가져 오려고 할 때 null 결과를 나타냅니다. 첫 번째 해결 방법은 초기화 후에만 display:none 속성을 설정하는 것이었지만, 다시 표시하고 싶었을 때 모든 초기화가 손실되었습니다 (텍스트 레이블이 모두 기본값 임). 이것은 DVE가 display:none 인 콘텐츠가 단순히 숨겨진 것이 아니라 DOM에서 어떻게 든 지워진다는 것을 증명한다고 생각합니다. display:none 대신 visibility:hidden도 사용하려고했으나 페이지 레이아웃이 엉망이되었습니다. 모든 브라우저에서 작동하는 것 같다 유일한 해결책은 당신이 전에 그 요소의 스타일을 변경한다고 가정 내가 it is suggested here...

position: absolute; 
top: -9999px; 
left: -9999px; 
0

처럼 "외부 공간"에 숨길 DIV를 배치 (지금까지)입니다 그 요소조차도 HTML 페이지에서 생성됩니다. 웹 페이지의 일부 요소에 액세스하려고 할 때 그 시점에 해당 요소를 페이지에서 사용할 수 없다면 Null을 반환합니다. 제 제안은 해당 요소가 완전히로드 된 후 해당 JavaScript 요소를 다음과 같은 속성을 사용하여 실행하는 것입니다. onclick, onload