Я создал менеджер зависимостей javascript / css, похожий на http://code.google.com/p/jingo/.
Это позволяет мне сделать что-то вроде этого:
Loader.DependsOn(['/scripts/jqueryui.js', '/scripts/jquery.js'])
.Css('/css/jquery.css')
.Execute(function() { //Insert script here});
Загрузчик будет динамически загружать как скрипт, так и CSS перед выполнением (если они еще не были загружены).
Все работает, кроме IE. Таблицы стилей загружаются путем добавления ссылки на заголовок документа. Однако перед этим загрузчик проверяет, зависит ли сам запрошенный файл CSS от другого модуля. Если это так, он выяснит, в каком порядке CSS-файлов он должен быть вставлен. Во всех браузерах, кроме IE, если я вставлю его в начало списка, любые другие таблицы стилей после будут переопределять его стили (предполагаемое поведение). Однако в IE, хотя он вставляется в начале, IE обрабатывает его так, как если бы он был в конце.
Есть ли способ заставить IE пересчитать стили?
ОБНОВЛЕНО СЛУЧАЙ ИСПЫТАНИЯ:
Создание двух таблиц стилей: sheet1.css, sheet2.css
sheet1.css
.testdiv
{
width:200px;
height:200px;
background-color:#c7c7c7;
}
sheet2.css
.testdiv
{
width:400px;
height:400px;
}
разметка:
<html>
<head>
<link href="style1.css" rel="stylesheet" "type="text/css" />
</head>
<body>
<div class="testdiv">
</div>
</body>
</html>
<script type="text/javascript" language="javascript>
setTimeout(function() {
var link = document.createElement('link');
link.href = 'sheet2.css';
link.rel = 'stylesheet';
link.type = 'text/css';
var head = document.head || document.getElementsByTagName('head')[0];
head.insertBefore(link, head.children[0]);
setTimeout(function () {
//suggestion from Simon West
document.body.className = document.body.className;
}, 3000);
}, 3000);
</script>
Что должно произойти:
Серая коробка 200 на 200 пикселей. Через 3 секунды он все еще там. Без изменений.
Что происходит в IE8
Серая коробка 200 на 200 пикселей. Через 3 секунды он увеличивается до 400 на 400 пикселей.
Что происходит в Safari (windows) -
Серая коробка 200 на 200 пикселей. Через 3 секунды он все еще там. Без изменений.
Это происходит с предложением @Simon West или без него.