Question

$("head").append('<link href="xxx.css" rel="stylesheet" type="text/css"/>');

I found this snippet is not working in IE 8?

Answer 1

According to this bug report on the jquery site, there may well be a problem in IE8 with appending css files to the dom that contain relative links.

The poster of the bug suggests that adding it as follows may work:

    var style = document.createElement("link");
    style.setAttribute("type", "text/css");
    style.setAttribute("rel", "stylesheet");
    style.setAttribute("href", "xxx.css");
    jQuery("head")[0].appendChild(style);

Or that using an absolute url may also work:

    $('<link rel="stylesheet" type="text/css" href="http://yoursite.com/css/xxx.css">').appendTo('head');

​

Although he goes on to say that any files included through @import within the appended css file will also not load as expected.

I would suggest giving these test cases a whirl to see what loads for you and what doesn’t (if it works you should get a grey background in the HTML window):

Method Used in OP’s question: http://jsfiddle.net/vs5NC/20/

First possible solution from my answer: http://jsfiddle.net/vs5NC/17/

Second possible solution from my answer: http://jsfiddle.net/vs5NC/19/

If none of these work, it’s possible that Chris Fulstow’s answer to a similar question may be a viable solution.