Как добавить таблицы стилей в IE с помощью jQuery?

Привет, ребята,

Я просто пытался создать плагин, и мне было нужно, чтобы он был удобным для пользователя, поэтому я хочу тег append тега <link/> на странице head страницы пользователей по мере загрузки моего плагина. Он отлично работает со всеми другими браузерами (не уверен в IE9, IE7 и IE6), но не работает для IE8! Я не ошибаюсь в своем плагине, поэтому я просто создал образец страницы и столкнулся с подобной проблемой! Вот моя тестовая страница HTML + код jQuery ------

<html>
       <head>
              <script src="../jquery-1.6.min.js"></script>
              <script>
                       $(document).ready(function () {
                          $(document.head).append('<link rel="stylesheet" type="text/css" href="style.css" />');
                       });
              </script>
       </head>
       <body>
              <h1>Text!</h1>
       </body>
</html>

И вот мой код CSS -----

body {
 background:#ddd; 
}
h1 {
 color: #789; 
}

Так может ли кто-нибудь сказать мне, где я ошибаюсь, или это проблема жизни?

СПАСИБО В РАСШИРЕНИИ

После просмотра первого комментария и отправки ссылки, я просто создал этот образец кода и нашел что-то потрясающее! Смотрите это ~~~

<html>
       <head>
              <script src="../jquery-1.6.min.js"></script>
              <script>
                       $(document).ready(function () {
                          if (document.getElementsByTagName('head')[0] === document.head) {
                           $("head").append('<link rel="stylesheet" type="text/css" href="style.css" />');
                          }else {
                           alert('This doesn\'t supports head appending!');
                          }
                       });
              </script>
       </head>
       <body>
              <h1>Text!</h1>
       </body>
</html>

При выполнении этой страницы с моим браузером IE8 я получаю сообщение о том, что

This doesn't supports head appending!

Ну, я не ошибаюсь в своем браузере или это ошибка IE8?

Ответы

Ответ 1

if (document.createStyleSheet)
{
    document.createStyleSheet("style.css");
}
else
{
    $("head")
       .append('<link rel="stylesheet" type="text/css" href="style.css" />'); 
}

Ответ 2

Вы используете document.head для доступа к голове. document.head является лишь недавним дополнением к DOM, как часть HTML5. Таким образом, он не поддерживается повсеместно.

Если вы хотите его использовать, вы должны добавить шайбу перед ее вызовом:

document.head = document.head || document.getElementsByTagName('head')[0];

В противном случае вы можете просто добавить непосредственно к тегу <head> (который рекомендуется, так как эта половина точки использования синтаксического сахара jQuery):

$("head").append(...);