Добавление оператора @import в динамическую таблицу стилей для IE7+

Question

У меня проблема с добавлением динамического элемента стиля с помощью операторов @import для IE. Попробуй это:

var string = '@import url(test.css)';
var style = document.createElement('style');

if (style.styleSheet) { // IE
    style.styleSheet.cssText = string;
} else {
    var cssText = document.createTextNode(string);
    style.appendChild(cssText);
}

document.getElementsByTagName('head')[0].appendChild(style);

Это работает для FF/Chrome, но не для IE. Кажется, признают style.styleSheets.imports, но он не будет применять импортированную таблицу стилей. Это ошибка или ограничение?

Answer 1

Многие старые браузеры не могут обрабатывать различные формы директивы @import, это можно использовать, чтобы скрыть css от них. Проверьте http://www.w3development.de/css/hide_css_from_browsers/import/ для деталей.

@import директивы должны быть первыми в таблице стилей, иначе они будут игнорироваться. Однако IE не игнорирует неуместные @import директивы.

Редактировать: см. Метод addImport для внедрения таблиц стилей в IE.