從Google的CDN下載jQuery UI CSS

Question

我打算使用Google下載UI和Core的jQuery庫。 我的問題是，他們允許我為此下載CSS還是應該自己托管它？

另外，如果我使用Google加載，應該如何加載其他插件？ 我可以將所有插件壓縮在一起嗎，還是應該將其單獨壓縮？

Answer 1

Google AJAX庫API，其中包括jQuery UI（當前為v1.10.3），並且根據jQuery UI博客還包括熱門主題：

Google Ajax庫API（CDN）

• 未壓縮： http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.js

• 壓縮后： http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js

• 不受壓縮的主題： 黑色領帶 ， 西服 ， 庫比蒂諾 ， 暗黑蜂巢 ， 點愛 ， 茄子 ， 興奮自行車 ， 輕彈 ， 熱偷偷摸摸 ， 人性 ， le-frog ， 薄荷choc ， 陰天 ， 胡椒研磨機 ， redmond ， 光滑度 ， 南大街 ， 起點 ， 陽光明媚 ， 花哨 的錢包 ， 突兀的 ， ui黑暗的 ， ui lightness和vader 。

• 壓縮主題： 黑領結 ， 西服 ， 庫比蒂諾 ， 暗黑蜂巢 ， 點愛 ， 茄子 ， 興奮自行車 ， 輕彈 ， 熱溜溜 ， 人性化 ， 青蛙 ， 薄荷巧克力 ， 陰天 ， 胡椒研磨機 ， 雷德蒙德 ， 光滑度 ， 南大街 ， 起點 ， 陽光明媚 ， 花哨 的錢包 ， 突兀的 ， ui黑暗的 ， ui lightness和vader 。

Answer 2

jQuery現在具有CDN訪問權限：

code.jquery.com/ui/ [版本] / themes / [主題名稱] /jquery-ui.css

---

為了使這更容易一點，在這里，您可以：

• 基本： http ： //code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css
• 黑色領帶： 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
• 暗蜂巢： http : //code.jquery.com/ui/1.9.1/themes/dark-hive/jquery-ui.css
• 點-luv： http ： //code.jquery.com/ui/1.9.1/themes/dot-luv/jquery-ui.css
• 茄子： http : //code.jquery.com/ui/1.9.1/themes/eggplant/jquery-ui.css
• 刺激自行車： http ： //code.jquery.com/ui/1.9.1/themes/excite-bike/jquery-ui.css
• 輕彈： http ： //code.jquery.com/ui/1.9.1/themes/flick/jquery-ui.css
• 熱偷偷摸摸的： http : //code.jquery.com/ui/1.9.1/themes/hot-sneaks/jquery-ui.css
• 人類： 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
• 陰： 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
• 雷德蒙德： http : //code.jquery.com/ui/1.9.1/themes/redmond/jquery-ui.css
• 平滑度： http : //code.jquery.com/ui/1.9.1/themes/smoothness/jquery-ui.css
• 南街： http : //code.jquery.com/ui/1.9.1/themes/south-street/jquery-ui.css
• 開始： http ： //code.jquery.com/ui/1.9.1/themes/start/jquery-ui.css
• 晴天： http ： //code.jquery.com/ui/1.9.1/themes/sunny/jquery-ui.css
• 時髦的錢包： 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

Answer 3

Google通過此鏈接托管jQueryUI CSS https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.all.css

如果直接看這段代碼，它將使用@import導入css ，這可能會很慢 。 您可能需要將導入因素分解成一些部分，以獲得輕微的性能優勢：

https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.base.css https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base /jquery.ui.theme.css

Answer 4

如果您是指jQuery UI CSS，則可以使用此代碼：

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

Answer 5

我會這樣認為。 為什么不？ 沒有提供CD來支持腳本文件的CDN不會太多

該鏈接表明它們是：

我們感到特別令人興奮的是，jQuery UI CSS主題現在托管在Google的Ajax Libraries CDN中。

Answer 6

正如奧巴馬所說的“是的”。 這是鏈接。 developers.google.com/#jquery

您需要使用

谷歌

ajax.googleapis.com/ajax/libs/jqueryui/[VERSION NO]/jquery-ui.min.js
ajax.googleapis.com/ajax/libs/jqueryui/[VERSION NO]/themes/[THEME NAME]/jquery-ui.min.css

jQuery CDN

code.jquery.com/ui/[VERSION NO]/jquery-ui.min.js
code.jquery.com/ui/[VERSION NO]/themes/[THEME NAME]/jquery-ui.min.css

微軟

ajax.aspnetcdn.com/ajax/jquery.ui/[VERSION NO]/jquery-ui.min.js
ajax.aspnetcdn.com/ajax/jquery.ui/[VERSION NO]/themes/[THEME NAME]/jquery-ui.min.css

在圖庫子標簽中的http://jqueryui.com/themeroller/中查找主題名稱

。

但由於以下原因，我不建議您從CDN托管

1. 盡管與其他CDN相比，使用Google CDN的命中率很高，但仍然非常低。（任何CDN不僅限於Google）。
2. 通過CDN加載，您將有3個請求，一個針對jQuery.js，一個針對jQueryUI.js，一個針對您的代碼。 您可能會在本地壓縮它，並將其作為一個資源加載。

http://zoompf.com/blog/2010/01/should-you-use-javascript-library-cdns