iFraming on the fly

Давно слышал о проблемах с созданием динамических iframe и заполнении их содержимым, но посмотреть что и как самому всё никак не доходили руки, теперь же, по причинам связанным с не приходящим сном, я эту тему затрону.

Для примера я набросал простую страничку создающую iframe по клику мыши. Изначально я записал всё одной функцией выполняющейся в один поток, но результата никакого небыло, решение было найдено — собственно участок кода, в котором происходит редактирование iframe я записал в функцию setTimeout, тем самым вынес его в отдельный поток выполнения:

setTimeout(function(){
        //редактируем iframe;
    },0);

После чего код начал работать. Буквально пару часов спустя, я показал описанное выше @chaos_8 и он разъяснил, что суть не в вызове setTimeout(), а в том, что после создания iframe нужно дождаться события onload (как и при работе с объектом Image).

Получившийся исходный код:

function start() {
    var fB = document.getElementById('frame_block');
    var frame = document.createElement('iframe');
    frame.setAttribute('width','640');
    frame.setAttribute('height','480');
    frame.onload = function() {
        var doc = frame.contentWindow.document;
        doc.body.innerHTML = 'Test it';
    }
    fB.appendChild(frame);
}