[javascript] 스크립트 태그에서 onload 이벤트를 시작하려고합니다.

일련의 스크립트를 순서대로로드하려고하는데 onload 이벤트가 발생하지 않습니다.

    var scripts = [
        '//cdnjs.cloudflare.com/ajax/libs/less.js/1.3.3/less.min.js',
        '//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.3/handlebars.min.js',
        MK.host+'/templates/templates.js'
    ];

    function loadScripts(scripts){
        var script = scripts.shift();
        var el = document.createElement('script');
        el.src = script;
        el.onload = function(script){
            console.log(script + ' loaded!');
            if (scripts.length) {
                loadScripts(scripts);
            }
            else {
                console.log('run app');
                MK.init();
            }
        };

        $body.append(el);
    }

    loadScripts(scripts);

el.onload와 같은 네이티브 이벤트는 jQuery를 사용하여 요소를 DOM에 추가 할 때 발생하지 않는다고 생각합니다. 네이티브 document.body.appendChild(el)를 사용하면 예상대로 실행됩니다.



답변

당신은 설정해야합니다 src속성 onload 이벤트를 f.ex :

el.onload = function() { //...
el.src = script;

또한 이벤트 첨부 하기 전에 DOM에 스크립트를 추가해야합니다 onload.

$body.append(el);
el.onload = function() { //...
el.src = script;

readystateIE 지원 을 확인해야합니다 . jQuery를 사용하는 경우 http://api.jquery.com/jQuery.getScript/getScript() 메소드를 사용해 볼 수도 있습니다 .


답변