internet explorer 8 - Unknown Runtime Error when using JavaScript to append CSS to Body in IE8 -


i'm having issue inserting css @import rule <body> in internet explorer 8. i'm doing way defer non-critical css.

when run following code "unknown runtime error" on line 6 (ref_obj.innerhtml = ...):

var css_path_str = "my.css", el_body = document.getelementsbytagname('body')[0], ref_obj = document.createelement("style");  ref_obj.type = "text/css"; ref_obj.innerhtml = "@import url(\""+css_path_1_str+"\");";  el_body.appendchild(ref_obj); 

as can guess, code works on chrome , firefox without issue.

after doing search here on so, stumbled on post - why document.getelementbyid('tableid').innerhtml not working in ie8? - says innerhtml style [and few other elements] on ie read-only.

any ideas how can edit code work around these limitations?

note: pure vanilla javascript.

edit:

problem solved, completeness, here code should work (cross-browser).

var css_path_str = "my.css", el_body = document.getelementsbytagname('body')[0], ref_obj = document.createelement("style"); ref_obj.type = "text/css";  el_body.appendchild(ref_obj);  if(ref_obj.stylesheet) {     //ie     ref_obj.stylesheet.csstext = "@import url(\""+css_path_str+"\");"; } else {     //other browsers     var ref_obj_text_node_obj = document.createtextnode("@import url(\""+css_path_str+"\");");     ref_obj.appendchild(ref_obj_text_node_obj); } 

what can make ie happy use stylesheet.csstext property of node after you've inserted dom:

var css_path_str = "my.css", el_body = document.getelementsbytagname('body')[0], ref_obj = document.createelement("style"); ref_obj.type = "text/css";  el_body.appendchild(ref_obj); ref_obj.stylesheet.csstext = "@import url(\""+css_path_str+"\");"; 

Comments

Popular posts from this blog

c# - Better 64-bit byte array hash -

webrtc - Which ICE candidate am I using and why? -

php - Zend Framework / Skeleton-Application / Composer install issue -