gpt4 book ai didi

javascript - 使用 javascript 控制 css 适用于 Mozilla 和 Chrome,但不适用于 IE

转载 作者:数据小太阳 更新时间:2023-10-29 05:11:16 26 4
gpt4 key购买 nike

我在使用 Internet Explorer 时应用 css(使用文本变量)时遇到问题,但它在 Firefox 和 Chrome 中有效。

the code:

/*! 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);

}/*___________________________________________________________________________*/

the use of the function:

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

最佳答案

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

通过使用 DOM 方法创建元素来添加新的样式表和脚本一直是跨浏览器的冒险。这在 IE 或 WebKit 中不起作用。

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

HTMLStyleElement 没有这样的属性。 <style>包含内联代码。对于外部样式表,使用 <link> .幸运的是,这确实有效:

var link= document.createElement('link');
link.rel= 'stylesheet';
link.href= 'something.css';
head.appendChild(link);

但没有给您提供从脚本插入规则的便捷方式。

您还可以使用 style 向现有样式表添加新规则(例如 <head> 中的空 document.styleSheets)界面。不幸的是,IE 的界面与此处的标准不太匹配,因此您需要代码分支:

var style= document.styleSheets[0];
if ('insertRule' in style)
style.insertRule('p { margin: 0; }', 0);
else if ('addRule' in style)
style.addRule('p', 'margin: 0', 0);

关于javascript - 使用 javascript 控制 css 适用于 Mozilla 和 Chrome,但不适用于 IE,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2710284/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com