appendChild not working in IE6

Discussion in 'Javascript' started by Robi, Jul 24, 2005.

  1. Robi

    Robi Guest

    I have the following code:

    ##############
    var nHead=(document.getElementsByTagName)?document.getElementsByTagName("head").item(0):document.head;
    var nStyle=document.createElement("style");
    // nStyle.type="text/css";
    nStyle.setAttribute("type","text/css");
    nHead.appendChild(nStyle);
    var cssText=document.createTextNode(
    '\r\t.class1 { font-family: Verdana, sans-serif; font-size:1; color:#ffff00; font-weight: bold;} '+
    '\r\t.class2 { font-family: Verdana, sans-serif; font-size:1; color:#00ffff; font-weight: bold;} '+
    '\r\t.class3 { font-family:Arial,sans-serif;font-size:3;color:#00ff00;font-weight: bold;} '+
    '\r\t.class4 { font-family:Arial,sans-serif;font-size:3;color:#0000ff;font-weight: bold;} '+
    '\r\t.class5 { font-family:Arial,sans-serif;font-size:3;color:#ff0000;font-weight: bold;} \r'
    );

    nStyle.appendChild(cssText);
    ##############

    this last nStyle.appendChild(cssText); returns the following error in IE6:
    Error: Unexpected call to method or property access.
    Code: 0

    in FF this seems to work

    Can anybody point out the problem?
     
    Robi, Jul 24, 2005
    #1
    1. Advertisements

  2. Try this:

    nstyle.cssText =
    '\r\t.class1 { font-family: Verdana, sans-serif; font-size:1;
    color:#ffff00; font-weight: bold;} '+
    '\r\t.class2 { font-family: Verdana, sans-serif; font-size:1;
    color:#00ffff; font-weight: bold;} '+
    '\r\t.class3 {
    font-family:Arial,sans-serif;font-size:3;color:#00ff00;font-weight:
    bold;} '+
    '\r\t.class4 {
    font-family:Arial,sans-serif;font-size:3;color:#0000ff;font-weight:
    bold;} '+
    '\r\t.class5 {
    font-family:Arial,sans-serif;font-size:3;color:#ff0000;font-weight:
    bold;} \r';

    ##############
    Not sure about cross-compatibility of cssText, or applicable standards.
    Others here are more qualified to speak to those issues.
     
    Christopher J. Hahn, Jul 24, 2005
    #2
    1. Advertisements

  3. Robi wrote:

    Known problem with IE, IE 4 started with its own object model and while
    IE 5 and later are supposed to implement the W3C DOM unfortunately there
    are some elements on which full core DOM support is not there so that
    for instance appendChild does not work, script and style elements are
    examples of that. It is mostly elements where IE already has/had its own
    specialized API to construct the contents of the element, for instance
    the contents of the style element is a (CSS) stylesheet and IE has its
    own API to add rules to such a sheet.
    So some way to add a style rule with IE/Win and with Mozilla and with
    Opera 8 is

    var style = document.createElement('style');
    style.type = 'text/css';
    var selector = 'html';
    var properties = 'color: darkblue; background-color: lightblue';
    document.getElementsByTagName('head').item(0).appendChild(style);
    if (document.styleSheets) {
    var lastSheet = document.styleSheets[document.styleSheets.length - 1];
    if (lastSheet && typeof lastSheet.addRule != 'undefined') {
    lastSheet.addRule(selector, properties);
    }
    else {
    style.appendChild(document.createTextNode(selector + ' { ' +
    properties + ' }'));
    }
    }
    else {
    style.appendChild(document.createTextNode(selector + ' { ' +
    properties + ' }'));
    }

    Or you could use try/catch to catch the IE error and then script the IE way.
     
    Martin Honnen, Jul 24, 2005
    #3
  4. Robi

    ASM Guest

    personaly, my IE (5.1 5.2 Mac)
    is angry with 'type' in wahtever way I try to pass it

    nStyle.setAttribute("type","text/css");
    MyObj.type = "text/css"

    have to innerHTML the complete tag ?
     
    ASM, Jul 24, 2005
    #4
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.