onload 함수를 찾을 수 없습니다.

Question

이상한 문제가 발생했습니다. 나는 책 응용 프로그램을 개발하고 자바 스크립트 onload를 사용하고 있습니다. 나는 어딘가에 HTML의 끝 부분에 자바 스크립트를 포함시키는 것이 가장 좋습니다. 이것은로드 된 대부분의 HTML에 적용됩니다. 그러나 일부는 onload init()가 발견되지 않는다고 불평합니다. 이것은 HTML 머리에 javascript를 포함하면 해결됩니다. 그러나 다른 HTML보다 이상하게 행동하기 시작합니다. onload는 페이지가 완전히로드되기 전에 호출됩니다. 나는 정확한 스크롤 폭을 얻지 못한다. 무엇이 worng 일 수 있는지 제안하십시오. 뭐죠 자바 스크립트를 포함하는 가장 좋은 방법. 나는 다음과 같이 정의했다

columizer ID를 사용하여 CSS를 열 폭을 다음과 같이 감사

HTML입니다. 아래 CSS 스타일

#columnizer 
{ 
width:290px; 
height:450px; 
column-width:290px; 
column-gap:10px; 
word-wrap:break-word; 
} 

Javascript onload is defined like this. 

function init() 
{ 
docScrollWidth = document.getElementById('columnizer').scrollWidth; 
document.getElementsByTagName('body')[0].style.width = docScrollWidth + "px"; 
window.external.notify(str); 
} 

Answer 1

실제 대답은 내 의견에 이었기 때문에, 나는 내 대답에 그것을 추가 할 것입니다 :

내 생각 엔 당신이 선언되어야 할 것이다 window.onload = init(); 대신 window.onload = init; 및 init 함수 같은 것을하고있는 것입니다 그 임무를 수행하기 전에. 괄호없이 함수 참조를 지정합니다. 괄호를 사용하면 즉시 실행됩니다.

---

당신은이 코드를 사용하는 말 :이와

docScrollWidth = document.getElementsByTagName('body')[0].style.width 

가장 큰 문제는 style.width은 본체 만 개체에 직접 설정 한 스타일 속성을 읽는 것입니다. 레이아웃이나 CSS 규칙에 의해 계산 된대로 객체의 너비를 가져 오지 않습니다.

---

그래서 대신 사용해야하는 것은 실제로 수행하려는 작업에 따라 다릅니다. 내용이 완전히 고정 된 너비가 아닌 경우 본문 너비는 거의 항상 윈도우 너비와 같거나 커집니다. 그래서, 당신이 여기서 성취하려고하는 것이 무엇인지 궁금합니다. 대신 사용해야하는 것은 실제로하려는 일에 달려 있습니다. 당신이 document.getElementsByTagName('body')[0]을 필요가 없습니다

---

참고로, document.body 몸 객체에 대한 직접 참조입니다.

Answer 2

먼저 문제를 정의하겠습니다. window.onload 이벤트는 프로그래머가 웹 응용 프로그램을 시작하는 데 사용됩니다. 이것은 메일 애플리케이션을 초기화하는 것과 같은 메뉴 나 복잡한 것을 움직이는 것과 같이 사소한 것일 수 있습니다. 문제는 모든 페이지 내용 (이미지 및 기타 이진 내용 포함)이로드 된 후에 onload 이벤트가 발생한다는 것입니다. 페이지에 많은 이미지가 포함 된 경우 페이지가 활성화되기 전에 눈에 띄는 지연이 발생할 수 있습니다. 우리가 원했던 것은 모든 성가신 이미지가로드 될 때까지 기다리지 않고 DOM이 완전히로드 된시기를 결정하는 방법입니다.

모질라는 DOMContentLoaded에 맞게 (문서화되지 않은) 맞춤 이벤트를 제공합니다. 다음 코드는 모질라 플랫폼에서 정확히 우리가 원하는 것을 할 것입니다 :

// for Mozilla browsers 

if (document.addEventListener) { 
    document.addEventListener("DOMContentLoaded", init, false); 
} 

그래서 Internet Explorer 정보를?

IE는 지연 태그에 대해 매우 편리한 (그러나 비표준) 속성을 지원합니다. 이 속성이 있으면 DOM에로드 될 때까지 스크립트의로드를 지연하도록 IE에 지시합니다. 그러나 외부 스크립트에서만 작동합니다. 또 다른 중요한 점은 스크립트를 사용하여이 속성을 설정할 수 없다는 것입니다. 즉, DOM 메소드를 사용하여 스크립트를 생성하고 지연 특성을 설정할 수 없으므로 무시됩니다. 우리의 onload 이벤트 핸들러를 호출하는 코드 한 줄을 것이 외부 스크립트의

<script defer src="ie_onload.js" type="text/javascript"></script> 

내용 : 우리는 우리의 onLoad 핸들러를 호출하는 미니 스크립트를 만들 수있는 편리한 연기 속성을 사용

init(); 

이 접근 방식에는 약간의 문제가 있습니다. 다른 브라우저는 지연 속성을 무시하고 즉시 스크립트를로드합니다. 몇 가지 방법이 있습니다.

<!--[if IE]><script defer src="ie_onload.js"></script><![endif]--> 

IE는 conditional compilation을 지원합니다 : 내 선호하는 방법은 다른 브라우저에서 연기 스크립트를 숨길 conditional comments을 사용하는 것입니다. 다음 코드는 위의 HTML에 해당하는 JavaScript입니다.

// for Internet Explorer 

/*@cc_on @*/ 
/*@if (@_win32) 
    document.write("<script defer src=ie_onload.js><\/script>"); 
/*@end @*/ 

지금까지 그렇게 좋았습니까? 이제 나머지 브라우저를 지원해야합니다. 표준 창 하나만 있습니다.onload 이벤트 :

// for other browsers 

window.onload = init; 

하나의 문제가 남아 있습니다 (누구나 쉽게 할 수 있을까요?). 나머지 브라우저에 대한 onload 이벤트를 트래핑하기 때문에 IE 및 Mozilla에 대해 init 함수를 두 번 호출합니다. 이 문제를 해결하려면 함수를 플래그하여 한 번만 실행되도록해야합니다. 나는이 기술을 보여줍니다 sample page을 제공 한

function init() { 
    // quit if this function has already been called 
    if (arguments.callee.done) return; 

    // flag this function so we don't do the same thing twice 
    arguments.callee.done = true; 

    // do stuff 
}; 

: 그래서 우리의 초기화 방법은 다음과 같을 것입니다.