从Google的CDN下载jQuery UI CSS。
问题出现的原因是Google的CDN链接中的CSS导入方式可能会导致加载速度较慢。为了提高性能,可以将导入拆分为多个部分。
解决方法是将CDN链接中的CSS导入拆分为以下几个部分:
1. https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.base.css
2. https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.theme.css
这样做可以略微提高性能。
问题的原因是用户想要使用jQuery UI CSS库,但是希望能够从Google的CDN下载。解决方法是通过以下链接访问相应的CSS文件,从而实现从CDN下载:
- base: http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css
- black-tie: http://code.jquery.com/ui/1.9.1/themes/black-tie/jquery-ui.css
- blitzer: http://code.jquery.com/ui/1.9.1/themes/blitzer/jquery-ui.css
- cupertino: http://code.jquery.com/ui/1.9.1/themes/cupertino/jquery-ui.css
- dark-hive: http://code.jquery.com/ui/1.9.1/themes/dark-hive/jquery-ui.css
- dot-luv: http://code.jquery.com/ui/1.9.1/themes/dot-luv/jquery-ui.css
- eggplant: http://code.jquery.com/ui/1.9.1/themes/eggplant/jquery-ui.css
- excite-bike: http://code.jquery.com/ui/1.9.1/themes/excite-bike/jquery-ui.css
- flick: http://code.jquery.com/ui/1.9.1/themes/flick/jquery-ui.css
- hot-sneaks: http://code.jquery.com/ui/1.9.1/themes/hot-sneaks/jquery-ui.css
- humanity: http://code.jquery.com/ui/1.9.1/themes/humanity/jquery-ui.css
- le-frog: http://code.jquery.com/ui/1.9.1/themes/le-frog/jquery-ui.css
- mint-choc: http://code.jquery.com/ui/1.9.1/themes/mint-choc/jquery-ui.css
- overcast: http://code.jquery.com/ui/1.9.1/themes/overcast/jquery-ui.css
- pepper-grinder: http://code.jquery.com/ui/1.9.1/themes/pepper-grinder/jquery-ui.css
- redmond: http://code.jquery.com/ui/1.9.1/themes/redmond/jquery-ui.css
- smoothness: http://code.jquery.com/ui/1.9.1/themes/smoothness/jquery-ui.css
- south-street: http://code.jquery.com/ui/1.9.1/themes/south-street/jquery-ui.css
- start: http://code.jquery.com/ui/1.9.1/themes/start/jquery-ui.css
- sunny: http://code.jquery.com/ui/1.9.1/themes/sunny/jquery-ui.css
- swanky-purse: http://code.jquery.com/ui/1.9.1/themes/swanky-purse/jquery-ui.css
- trontastic: http://code.jquery.com/ui/1.9.1/themes/trontastic/jquery-ui.css
- ui-darkness: http://code.jquery.com/ui/1.9.1/themes/ui-darkness/jquery-ui.css
- ui-lightness: http://code.jquery.com/ui/1.9.1/themes/ui-lightness/jquery-ui.css
- vader: http://code.jquery.com/ui/1.9.1/themes/vader/jquery-ui.css
此外,CDN还提供了所有相关的图片。由于CSS文件中的URL语句都是相对于CSS文件位置的,客户端会自动从CDN获取图片。现在CDN也支持HTTPS。
从上述内容中,我们可以得出以下问题的原因和解决方法:
问题:如何从Google的CDN下载jQuery UI CSS?
原因:Google AJAX Libraries API包含了jQuery UI以及流行的主题,但这些CSS脚本目前并没有被压缩/最小化,这意味着如果你的连接速度较快并且用户没有缓存这些文件,你可以通过自己的域名提供更小的版本,这样可能会更快。
解决方法:
1. 从Google的CDN下载未压缩的CSS版本,链接格式为:xxx
2. 从Google的CDN下载压缩的CSS版本,链接格式为:xxx
3. 如果要自动获取最新的CSS/JS版本,可以去掉URL中的次要版本号,只保留主要版本号。
4. 注意,不建议这样做,因为Google在非完全指定版本的库上设置了非常短的缓存时间。同时,在获取最新版本之前,请确保它仍能正常工作。
5. 要获取压缩的CSS版本,只需将.css替换为.min.css。
6. 在代码中包含上述链接时,省略协议部分,例如 <link rel="stylesheet" href="//ajax.googleapis.com/etc" />
这样无论用户请求的协议是什么,都会包含正确的版本。同样适用于包含jQuery和jQuery UI JS文件。
7. 更新jQuery UI版本号,并参考Google托管库的开发人员指南,根据需要选择合适的CDN名称。
8. 支持HTTPS的域名为ajax.googleapis.com
,在使用CDN时,始终使用HTTPS而不是协议相对URL。此外,可以参考如何在脚本标签中添加子资源完整性的操作方法。
以上是关于如何从Google的CDN下载jQuery UI CSS的问题的原因和解决方法。