有没有办法将css从javascript文件中的字符串添加到带有javascript的文档头?
假设我们有一个网页,它有一个lightbox脚本,这个脚本需要一个CSS文件才能运行.
现在,将此CSS文件添加到<link>
将使CSS文件下载,即使对于未启用js的用户也是如此.
我知道我可以用脚本动态加载CSS文件,但这也意味着将有2个http请求,在文件中几乎没有CSS的情况下,我发现效率很低.
所以我心想,如果你可以把CSS文件中的CSS放到脚本中,让脚本解析CSS并将其添加到头部,或者更好的做法是让脚本直接将CSS添加到文档的第<head>
个部分.
但是我在网上没有找到任何迹象表明这是可能的,那么可以用js将CSS添加到头部吗?
编辑+解决方案:
我编辑了roryf的答案以跨浏览器工作(IE5除外)
Javascript:
function addcss(css){
var head = document.getElementsByTagName('head')[0];
var s = document.createElement('style');
s.setAttribute('type', 'text/css');
if (s.styleSheet) { // IE
s.styleSheet.cssText = css;
} else { // the world
s.appendChild(document.createTextNode(css));
}
head.appendChild(s);
}