jquery – 我可以根据需要加载外部样式表吗?

前端之家收集整理的这篇文章主要介绍了jquery – 我可以根据需要加载外部样式表吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
$.getScript('ajax/test.js',function() {
  alert('Load was performed.');
});

..像上面的代码加载一个外部JS的请求,是否有类似的东西可以加载外部CSS样式表,当需要时?

例如,当我在我的网站上使用灯箱(内联弹出窗口),我想避免加载灯箱JS和CSS文件onload,除非用户要求。

谢谢

解决方法

Yup:如果您创建< link>标记链接到样式表,并将其添加到< head>标签,浏览器将加载该样式表。

例如。

$('head').append('<link rel="stylesheet" type="text/css" href="lightBox_stylesheet.css">');

但是,as per @peteorpeter’s comments,这不工作在IE 8或以下,在那里,你需要:

>将< link>在设置其href之前;要么
>使用IE的document.createStyleSheet()方法

此外,检查链接是否已添加已无法在所有浏览器中可靠地工作。

我也会质疑你的前提的一部分:

I want to avoid loading lightBox JS and CSS files onload,unless requested by the user.

为什么?减少页面重量?我可以理解的愿望,但你应该测量CSS和JS文件的大小(缩小和gzip后)与灯箱代码在那里,没有,看看是否减少是值得:

>按需加载的复杂性增加;和
> lightBox的响应性略有降低(因为当按需加载时,灯箱必须等待自己的CSS和JS加载,然后才能做它的事情)

在缩小和压缩之后,可能没有那么大的差别。

请记住,您可以指示浏览器缓存CSS和JS很长时间,这意味着它只有当用户使用空缓存访问您的网站时才会下载。

猜你在找的jQuery相关文章