Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New Coder
    Join Date
    Jan 2006
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    IE6 and document.getElementsByTagName not working at window.onload

    When I call a js file from within the <head>, IE borks at var headRef section of the following:

    Code:
    window.onload = function () {  
    	
    		var styles = document.createElement('style');
    		styles.setAttribute('type', 'text/css');
        	
    		var newStyle = document.createTextNode('something);  	
        		styles.appendChild(newStyle);
        	    
        		var headRef = document.getElementsByTagName('head').item(0);
            	headRef.appendChild(styles); 
            }
    document.getElementsByTagName('head').item(0) is returned as "null or undefined" so I guess that this is all happening before IE has built the DOM tree? Does window.onload not fire when the entire document is completed? I've tried document.onload too, no dice.

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Code:
    var headRef = document.getElementsByTagName('head')[0];
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #3
    Master Coder
    Join Date
    Feb 2003
    Location
    Umeå, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    This would seem to be the problem:
    Quote Originally Posted by rh2600
    Code:
    window.onload = function () {  
    	
    		var styles = document.createElement('style');
    		styles.setAttribute('type', 'text/css');
        	
    		var newStyle = document.createTextNode('something);  	
        		styles.appendChild(newStyle);
        	    
        		var headRef = document.getElementsByTagName('head').item(0);
            	headRef.appendChild(styles); 
            }
    Unless that's just a typo when you posted?
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #4
    New Coder
    Join Date
    Jan 2006
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yup sorry, that was just a typo. But Glenngv's modification fixed one issue, it has exposed the other.

    IE doesn't like the fact that I am creating an element called style. If I rename the element to anything else then IE returns no errors, but with 'style' IE says 'unexpected call to method or property access'. I guess its getting confused between an element 'style' and the property 'style'?

    Code:
    document.createElement('style')
    I guess I will just have to declare styles as properties of an object, and not try to create them as an element in the header.... sigh.....

  • #5
    Regular Coder
    Join Date
    Aug 2005
    Posts
    282
    Thanks
    0
    Thanked 0 Times in 0 Posts
    why not just use the document.createStyleSheet method?
    http://msdn.microsoft.com/workshop/a...stylesheet.asp

  • #6
    New Coder
    Join Date
    Jan 2006
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Because it is very important that *everything* that is done, is done within one (.js) file

  • #7
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Huh? What do you mean? document.createStyleSheet will not create a CSS file physically, it returns a stylesheet object where you can dynamically add rules. Here's a good tutorial for this.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #8
    Regular Coder
    Join Date
    Aug 2005
    Posts
    282
    Thanks
    0
    Thanked 0 Times in 0 Posts
    *everything* that is done, is done within one (.js) file
    and how would this *not* be within one js file?
    you would access the created styleSheet object and apply your styles to it's cssText, for IE, that is, or use the addRules(), blah stuff as glenn is referring to.

    document.createStyleSheet will not create a CSS file physically, it returns a stylesheet object where you can dynamically add rules.
    yes, exactly, is that not what he wants to do? dynamically append styles to his document?
    with ie, you can bulk write to this [object] via .cssText, sort of haxish, but sometimes must be done to get around it's downfalls.

  • #9
    New Coder
    Join Date
    Jan 2006
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Sorry yes

    You are right, this would allow me to feed styles to IE. I would prefer using standards based approach, so instead of using this method along with the createElement method, I am thinking about setting style attributes one-by-one.

    I see what people mean when they moan about IE's DOM bugs though...

    Thanks for your help


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •