data loading......please wait....
jQuery
The Write Less, Do More, JavaScript Library
TonyQ
在html中 , javascript能做什麼?
來個酷炫的網頁特效
貼心的使用者提示與處理
越來越即時的資訊處理(with ajax)
那jQuery能做什麼?
做javascript做的到的事情
將視野從一個元素轉換成一群元素
更簡單的介面
能協助跨瀏覽器的設計
隱藏顯示(fade/slider)
<textarea class="source noupdate" rows="10" cols="50">
box1
box2
box1
box2
box1
</textarea>
<textarea class="code" rows="5" cols="40"></textarea>
圓角處理 -
jQuery corner
<textarea class="source noupdate" rows="10" cols="50">
</textarea>
<textarea class="code" rows="5" cols="40">$(".redbox").corner("bevel");</textarea>
drag and drop
the road
<textarea class="code" rows="10" cols="60">$(".top img").draggable({helper: 'clone'}); $(".bottom").droppable({ accept: ".top img", tolerance:'touch', drop: function(ev, ui) { $(this).append(ui.draggable); } }); </textarea>
ajax handler
<textarea class="source" rows="10" cols="60">
</textarea> <textarea class="code" rows="10" cols="60"> </textarea>
從一個元素到一群元素
selectors
<textarea class="source" rows="10" cols="40"> first Text
line1
line2
line3
last Text </textarea>
code window:
<textarea class="code" rows="3">alert('hello , every body!')</textarea>
jQuery 部份常用function列表
jQuery
$
jQuery的alias
$( expression, context )
selector
$( html )
以html建立dom物件
$( dom )
轉換 dom物件 為 jQuery型別
$( fn )
A shorthand for $(document).ready()
資料結構
$().size()
jQuery陣列大小
$().get(index)
取得位於index的dom
$().data(key,value)
儲存資料
$().data(key)
取得資料
$().attr(key,vale)
更改attr
$().css(key,vale)
更改css
事件區
$().click(fn)
將fn指定給對應的jQuery物件上的click事件(不限定一次)
$().click()
觸發click事件(click trigger)
$().hover(fnOver,fnOut)
將滑鼠滑過與移出的事件結合
其他
$().hide()
隱藏資料
$().show()
顯示資料
$().each(fn)
詢覽資料
以及其他數十個function族繁不及備載...
jQuery
The Write Less, Do More, JavaScript Library
http://jquery.com/