國產(chǎn)jQuery UI框架 (jUI)?DWZDWZ富客戶端框架(jQuery RIA framework), 是中國人自己開發(fā)的基于jQuery實(shí)現(xiàn)的Ajax RIA開源框架. 設(shè)計(jì)目標(biāo)是簡單實(shí)用,快速開發(fā),降低ajax開發(fā)成本。 歡迎大家提出建議,我們將在下一版本中進(jìn)一步調(diào)整和完善功能.共同推進(jìn)國內(nèi)整體ajax開發(fā)水平。
創(chuàng)新互聯(lián)建站是一家專業(yè)提供雨山企業(yè)網(wǎng)站建設(shè),專注與成都網(wǎng)站建設(shè)、網(wǎng)站制作、H5高端網(wǎng)站建設(shè)、小程序制作等業(yè)務(wù)。10年已為雨山眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)絡(luò)公司優(yōu)惠進(jìn)行中。
2.jQuery的界面插件?Ninja UI
jQuery 是一個(gè)非常優(yōu)秀的 JavaScript 框架,而且還有相當(dāng)多的插件。其中的一些UI插件也相當(dāng)?shù)慕o力,比如 Ninja UI,是一款界面插件,使用它將能給你的項(xiàng)目增色不少。此插件包含有幻燈,智能提示等常見的效果。
3.jQuery的UI框架?Chico UI
和 jQuery UI 一樣,Chico UI 包含 auto-complete, blink, carousel, countdown, date-picker, dropdown, expand, calendar 等諸多逐漸,同時(shí)還提供一個(gè) CSS 布局框架,用于實(shí)現(xiàn)網(wǎng)頁布局和表格。
4.jQuery UI 組件庫?PrimeUI
PrimeUI 是 PrimeFaces 團(tuán)隊(duì)的一個(gè) jQuery UI 組件庫,目前包含多個(gè) UI 部件
5.Jquery的UI庫?w2ui
基于Jquery的UI庫,包含常用UI組件,如:布局、表格、樹形、Tabs、工具條、彈出菜單、表單等等。
采用Html5 + CSS3編寫,可以支持常用的瀏覽器,如:Chrome、FireFox7+、Safari 5+和IE 9+等。
6.jQuery UI組件?jQuery UI
jQueryUI 是一套 jQuery 的頁面 UI 插件,包含很多種常用的頁面空間,例如 Tabs(如本站首頁右上角部分) 、拉簾效果(本站首頁左上角)、對話框、拖放效果、日期選擇、顏色選擇、數(shù)據(jù)排序、窗體大小調(diào)整等等非常多的內(nèi)容。
7.jQuery的UI工具包?jQuery Tools
jQuery easyui 為網(wǎng)頁開發(fā)提供了一堆的常用UI組件,包括菜單、對話框、布局、窗簾、表格、表單等等組件,
8.jQuery的UI框架?Liger UI
LigerUI是基于jQuery開發(fā)的一系列控件組,包括表單、布局、表格等等常用UI控件 使用LigerUI可以快速創(chuàng)建風(fēng)格統(tǒng)一的界面效果
9.快速開發(fā)WebUI?jQuery MiniUI
jQuery MiniUI - 快速開發(fā)WebUI。
包含控件:DataGrid、Tree、TreeGrid、Menu、Toolbar、Tabs、Layout、Panel、DatePicker、ComboBox、TreeSelect、TextBoxList等。
典型應(yīng)用:頁面布局、CRUD、Master/Detail、數(shù)據(jù)驗(yàn)證等。
10.jQuery的UI插件?Smart UI
JQuery Smart UI是基于JQuery的Ajax開發(fā)框架,實(shí)現(xiàn)前、后臺(tái)分離、功能和數(shù)據(jù)分離,UI層全部使用htm+js+json完成,通過一個(gè)統(tǒng)一數(shù)據(jù)接口與服務(wù)端進(jìn)行數(shù)據(jù)交換。
工具/材料
Sublime Text
01
先打開Sublime Text,然后在編輯器中添加HTML5頁面,如下圖所示,由于頁面中中文,所以編碼需要設(shè)置成utf-8的格式
02
接下來需要下載Jquery UI的庫文件,并且在HTML中導(dǎo)入Jquery UI的樣式庫文件,如下圖所示
03
由于顏色動(dòng)畫特效需要JS腳本控制,所以需要導(dǎo)入Jquery的腳本和Jquery ui的腳本,如下圖所示。因?yàn)镴query ui是用jquery編寫的,所以先導(dǎo)入Jquery文件
04
然后在body標(biāo)簽中添加一個(gè)div和一個(gè)按鈕。Div標(biāo)簽是我們要操作的顏色塊,按鈕用來觸發(fā)動(dòng)畫操作,如下圖所示
05
接下來在頁面中添加style標(biāo)簽,并為上面設(shè)置的div顏色塊來添加樣式,如下圖所示
06
然后在script標(biāo)簽中添加我們腳本代碼,如下圖所示,通過調(diào)用animate方法進(jìn)行動(dòng)畫調(diào)用,它可以直接指定顏色塊的背景顏色
07
最后,我們運(yùn)行頁面程序,你會(huì)在頁面中看到一個(gè)顏色塊和一個(gè)按鈕,點(diǎn)擊按鈕以后,顏色塊發(fā)生變化了,如下圖所示
jquery是對原生javascript的封裝,框架。
jquery ui 是jquery的一個(gè)擴(kuò)展,也可以理解為插件。jquery ui 是基于jquery寫的一系列UI方面的框架。
jquery ui 可以說是官方插件。
一般你用的插件是民間的,你可以寫一個(gè),我也可以寫一個(gè)就是大家都可以基于jquery寫jquery的擴(kuò)展。
jquery mobile 是針對移動(dòng)客戶端的框架,其中實(shí)現(xiàn)了滑動(dòng)等移動(dòng)客戶端才有的動(dòng)作等一些特性。
jQuery UI開發(fā)Web程序步驟:
在百度搜索引擎搜索“jQuery UI”,并且下載。
解壓jquery-ui-1.11.4,工程目錄如下圖所示。
新建HTML文件,引入jquery-ui.min.css、jquery.js、jquery-ui.min.js三個(gè)文件。其中jquery-ui.min.css是jQuery UI樣式文件,jQuery UI顧名思義依賴jQuery,所以需要引入jQuery庫,另外,需要引入jQuery UI本身的Javascript庫,這里引入壓縮版本以減少文件的體積。
jQuery UI是以 jQuery 為基礎(chǔ)的開源 JavaScript 網(wǎng)頁用戶界面代碼庫。包含底層用戶交互、動(dòng)畫、特效和可更換主題的可視控件。
jquery ui 是jquery開發(fā)團(tuán)隊(duì) 開發(fā),適用于網(wǎng)站式的頁面.
jquery easyui 是第三方基于jquery開發(fā),適用于應(yīng)用程序式的頁面.
兩者的方法調(diào)用也略有不同:
jquery ui 是:
$("#divTabs").tabs("remove" ,index);
jquery easyui 是:
$("#divTabs").tabs("close" ,title);
類似的區(qū)別還有一些,只有具體使用后才會(huì)注意,基本思路差不多.
(1)jQuery是一個(gè)js庫,主要提供的功能是選擇器,屬性修改和事件綁定等。
(2)jQuery UI則是在jQuery的基礎(chǔ)上,利用jQuery的擴(kuò)展性,設(shè)計(jì)的插件。提供了一些常用的界面元素,諸如對話框、拖動(dòng)行為、改變大小行為等。
在運(yùn)用中會(huì)有閉包, 由于函數(shù)內(nèi)部定義變量作用域問題,如果外部想用這個(gè)內(nèi)部函數(shù)創(chuàng)建的一個(gè)變量;那就需要在這個(gè)函數(shù)內(nèi)部在創(chuàng)建一個(gè)函數(shù),創(chuàng)建的這個(gè)函數(shù)相當(dāng)于一個(gè)橋梁把內(nèi)部外部函數(shù)的變量拋出,這樣就解決了不能訪問這個(gè)變量的問題,那這個(gè)內(nèi)部函數(shù)就稱為閉包。
其具體特性如下:
a.函數(shù)內(nèi)再嵌套函數(shù)
b.內(nèi)部函數(shù)可以引用外層的參數(shù)和變量
c.參數(shù)和變量不會(huì)被垃圾回收機(jī)制回收
概括的說,閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù),在本質(zhì)上,它是將函數(shù)內(nèi)部和函數(shù)外部連接起來的一座橋梁。