Динамическая загрузка CSS - jQuery против простого Javascript

Я загружаю файл CSS в код сценария java. Сначала я использовал код jQuery. Работало нормально, но через некоторое время я понял, что правила CSS не применяются в браузере IE. Поэтому я погуглил и заменил его версией document.createElement. Теперь он плавно работает во всех браузерах. Кто-нибудь знает почему? Есть ли разница в этих двух подходах?

var cssNode = document.createElement('link');
cssNode.type = 'text/css';
cssNode.rel = 'stylesheet';
cssNode.href = filename;
cssNode.media = 'screen';
cssNode.title = 'dynamicLoadedSheet';
document.getElementsByTagName("head")[0].appendChild(cssNode);

vs.

var $fileref = $("<link />");
$fileref.attr("rel", "stylesheet");
$fileref.attr("type", "text/css");
$fileref.attr("href", filename);
$fileref.attr("media", "screen");
$fileref.attr("title", 'dynamicLoadedSheet');
$('head').append($fileref);

Спасибо, Paweł

PS Другой совет:

$('head').append($fileref);

document.getElementsByTagName("head")[0].appendChild($fileref[0]);

загрузка файла с первым подходом $ не выполняется, тогда как использование document.getElement ... работает. Итак, примерно так:

var $fileref = $("<link />");
$fileref.attr("rel", "stylesheet");
$fileref.attr("type", "text/css");
$fileref.attr("href", filename);
document.getElementsByTagName("head")[0].appendChild($fileref[0]);

работает.

----------------------- СОВЕТ 2 Еще один удар:

Этот работает:

var $fileref = $("<link />");
$fileref.attr("rel", "stylesheet");
$fileref.attr("type", "text/css");
$fileref.attr("href", filename);
document.getElementsByTagName("head")[0].appendChild($fileref[0]);

Этот не работает:

var $fileref = $('<link rel="stylesheet" type="text/css" href="' + filename + '" />')
document.getElementsByTagName("head")[0].appendChild($fileref[0]);
5
задан dragonfly 6 October 2010 в 13:35
поделиться