[JS] Probleem met IFRAME en Stylesheets

[ronaldmathies]

Ik heb het volgende probleem:

In Firefox of IE creër ik een IFRAME, met daarbinnen in de head een LINK element voor de stylesheet.

code:

function ajaxIFrameSuggestDocument() {
    iframeSuggest = document.getElementById('iframe.ajaxsuggest');
                
    if (iframeSuggest.contentDocument) { // For NS6
        return iframeSuggest.contentDocument;
    } else if (iframeSuggest.contentWindow) { // For IE5.5 and IE6
        return iframeSuggest.contentWindow.document;
    } else if (iframeSuggest.Document) { // For IE5
        return iframeSuggest.Document;
    }
}
        
function ajaxSuggestPrepareIFrame() {
    var iframeSuggest;
    var iframeSuggestDocument;
        
    var iframe = document.createElement('iframe');
    iframe.id = 'iframe.ajaxsuggest';
    iframe.scrolling = 'no';
    iframe.frameBorder = 0;
    iframe.src = 'javascript:;';
    iframe.style.position = 'absolute';
    iframe.style.visibility = 'hidden';
    document.getElementsByTagName('body')[0].appendChild(iframe);

    var link = document.createElement('link');
    link.href = '<%=request.getContextPath()%>/main/global/css/suggest.css';
    link.rel = 'stylesheet';
    link.type = 'text/css';
    ajaxIFrameSuggestDocument().getElementsByTagName('head')[0].appendChild(link);
        
    isSuggestIFramePrepared = true;
}

Deze code creërd prima de IFRAME en de LINK element in de IFRAME, echter de Stylesheet wil niet geladen worden door Firefox en IE.

Als ik elementen creër die gebruik maken van de stylesheet dan worden deze zonder opmaak weergegeven.

Als ik met de DOM inspector van Firefox kijk dan is alles goed.
Wee iemand waarom dit niet werkt?

[NMe]

Foutje? Javascript hoort in Webdesign & Graphics.

PW>>WG

[crisp]

Je genereert elementen in de scope van je ene document, en probeert die te appenden in een ander document; dat kan volgens mij niet. Verder lijkt het er op dat IE bij een leeg document enkel een HTML node heeft zonder head of body wat ook nog eens een probleem op zou kunnen leveren.
Ik heb zelf al zitten puzzelen, maar tot nog toe zonder echt resultaat; ik zie het link-element in de DOM inspector ook niet terug.

[crisp]

ah, met een timeout werkt het:

JavaScript:

function ajaxIFrameSuggestDocument()
{
    var iframeSuggest = document.getElementById('iframe.ajaxsuggest');

    if (iframeSuggest.contentDocument)
    {
        // For NS6
        return iframeSuggest.contentDocument;
    }
    else if (iframeSuggest.contentWindow)
    {
        // For IE5.5 and IE6
        return iframeSuggest.contentWindow.document;
    }
    else if (iframeSuggest.document)
    {
        // For IE5
        return iframeSuggest.document;
    }
}
        
function ajaxSuggestPrepareIFrame()
{        
    var iframe = document.createElement('iframe');
    iframe.id = 'iframe.ajaxsuggest';
    iframe.scrolling = 'no';
    iframe.frameBorder = 0;
    iframe.src = 'about:blank';
//  iframe.style.position = 'absolute';
//  iframe.style.visibility = 'hidden';
    document.getElementsByTagName('body')[0].appendChild(iframe);

    setTimeout('next()', 100);
}

function next()
{
    var link = ajaxIFrameSuggestDocument().createElement('link');
    link.rel = 'stylesheet';
    link.type = 'text/css';
    link.href = 'http://localhost/suggest.css';
    ajaxIFrameSuggestDocument().getElementsByTagName('head')[0].appendChild(link);

    var p = ajaxIFrameSuggestDocument().createElement('p');
    p.className = 'bla';
    p.appendChild(ajaxIFrameSuggestDocument().createTextNode('tralala'));
    ajaxIFrameSuggestDocument().getElementsByTagName('body')[0].appendChild(p);
}

[ronaldmathies]

@crisp:

Je kan inderdaad elementen in het ene document creëren en in het andere document invoegen.
En een IFRAME creëren levert in Firefox in iedergeval de standaard html, head en body elementen.

Ik zal eens naar die timeout kijken.
Bedankt.