управление CSS с JavaScript работает с Mozilla & Chrome, но не IE

Question

управление CSS с JavaScript работает с Mozilla & Chrome, но не IE

У меня есть проблемы с этой CSS применения функции (использующий текстовую переменную) работающий с Internet Explorer, но это работает в Firefox & Chrome.

код:

/*! addCssStyle() applies the text value $CssText$ to the the specified document
$Doc$ e.g. an IFrame; or if none specified, default to the current document,
*/function addCssStyle(CssText, Doc){

//Secure $Head$ for the current $Doc$
    Doc = Doc||document;    var head = Doc.getElementsByTagName('head')[0];
    if(!head || head == null){
        head = Doc.createElement('div');    Doc.body.appendChild(head);
    } if(!head || head == null){return false;}

//createElement('style')
    var PendingStyle = Doc.createElement('style');
//  if (is_gecko){PendingStyle.href = 'FireFox.css';}//???needeed???
    PendingStyle.type = 'text/css';
    PendingStyle.rel = 'stylesheet';
//  PendingStyle.media = 'screen';//???needeed???
    PendingStyle.innerHTML = CssText;
    head.appendChild(PendingStyle);

}/*___________________________________________________________________________*/

использование функции:

var NewSyleText = //The page styling
"h1, h2, h3, h4, h5 {font-family: 'Verdana','Helvetica',sans-serif; font-style: normal; font-weight:normal;}" +
"body, b {background: #fbfbfb; font-style: normal; font-family: 'Cochin','GaramondNo8','Garamond','Big Caslon','Georgia','Times',serif;font-size: 11pt;}" +
"p { margin: 0pt; text-indent:2.5em;  margin-top: 0.3em; }" +
"a {    text-decoration: none; color: Navy; background: none;}" +
"a:visited {    color: #500050;}" +
"a:active { color: #faa700;}" +
"a:hover {  text-decoration: underline;}";
addCssStyle(NewSyleText);//inserts the page styling

6

javascript internet-explorer google-chrome webkit

задан 21 revs, 2 users 87% 4 May 2011 в 22:19

2 ответа

Answer 1

var style = document.createElement('style');

Добавление новых таблиц стилей и сценариев путем создания элементов с использованием методов DOM всегда было рискованным кроссбраузерным способом. Это не будет работать в IE или WebKit.

style.rel = 'stylesheet';
style.href = 'FireFox.css';

В HTMLStyleElement таких свойств нет.