자바 스크립트 appendChild 콜백?

나는 다음과 같은 코드가있는 페이지에 HTML5 비디오를 추가해야합니다 : 재생 것 비디오를로드 할 video 태그 잠시 걸리기 때문에자바 스크립트 appendChild 콜백?

가

document.querySelector("#mydiv").appendChild(video); 
console.debug(document.querySelector("video").clientWidth);

내 문제는, 두 번째 줄은 0을 반환 . 페이지가로드 된 후 수동으로 두 번째 줄을 콘솔에 입력하면 실제 값이 표시됩니다. 타임 아웃을 사용하여 값이 업데이트되었는지 정기적으로 확인하는 것보다이 값을 얻는 더 좋은 방법이 있습니까?

출처

2014-11-21 Anonymous

'appendChild' 콜백? 대신 이벤트를 찾고 있습니까? 예 : ['loadedmetadata'] (http://www.w3.org/html/wg/drafts/html/master/embedded-content.html#event-media-loadedmetadata)? –

바로! 감사! 나는 이것을 몰랐다. 이 말을 답변에 게시하면 동의 할 것입니다. –

자바 스크립트는 하나의 스레드입니다. 코드를 이벤트 루프에 놓아야합니다. 그러면 DOM 작업이 가능한 js가 허용됩니다.

은 그냥 다음에 시도 :

document.querySelector("#mydiv").appendChild(video); 
setTimeout(function(){ 
    console.debug(document.querySelector("video").clientWidth); 
});

출처

2014-11-21 12:39:28

이 요소에 video.onloadstart 이벤트를 추가합니다.

video.onloadstart(getClientWidth); 
document.querySelector("#mydiv").appendChild(video); 
function getClientWidth() { 
    console.debug(document.querySelector("video").clientWidth); 
}

자세히 알아보기 here.

출처

2016-06-28 10:48:22

자바 스크립트 appendChild 콜백?

답변

관련 문제