Note: 精通Java Script+jQuery

Web結構行為分離
Web標準
1結構標準語言: XML- DATA transfer capability is good
2表現標準語言 : CSS( seperate structure and outlook design)
3行為標準語言

Ajax 優點:
1 It reliefs the server loading
2 Better user experience
3 No require for plugin
4 page and information are seperated.
5 非同步,可多工,多執行緒

Aajx 組成:
1 Java script
2 CSS
3 DOM: Ajax可改UI
4 XML httpRequest: To collect data by back end from web server. unsync with server.

非同步物件的屬性與方法

Get an Post模式: in HTML, two methods can be way of sending unsync request.
Ajax 框架:
-Ajax Lib
-Ajax Gold :
4 函數
– 1) getDataReturn Text
– 2) getDataReturn XML
– 3) postDataReturnText
– 4) postData ReturnXML

Download js檔:

by

將框架導入頁面:

Download jQuery: http://jquery.com . js檔

以$作為選擇器

document.getElementaryByID = (“#showDiv"

$(" .some class"> //類別選擇器
$(“p=odd")
$(“td=nth-child(1)
$(“li>a")

功能函數首碼

$.trim(sString) //去頭尾空格

建立DOM元素,用DOM 方法建立元素節點
var 0newP
=$(“

"
= var 0newP=dpcoment_createElement(“p";
= var 0text=document.createTextnote;
= onewP. appendchildcoText);

自訂新增$

Ex:
$. fn.disable=fuction()

解決"$"的衝突: jquery.noConflict()

用 addclass()或classname屬性 將其新增到指定元素中.

選擇器
屬性選擇器
basic選擇器
位置選擇器
過濾選擇器
function showchecked(0checkbox)
過濾選擇器反覆運算使用: checkbox:chcked:enable

實現反向過濾:not(filter)

———————————

jQuery function:
1 訪問頁面框架的局部
2 修頁面,jQuery用封裝好的Java Script程式碼(CSS3)
3 修頁面的content ( word, photo, form)
4 回應事件
5 加動畫
6 與server 非同步互動
7 簡化 java script 操作

Newest jQuery 框架 download jQuery at http://jquery.com

XXX Download 最小的jQuery1包(Minified), 不用 install, 直接將下載的.js檔用 標記,導入到自己的頁面即可

xxx $ 的用法
h2 a{ /選擇

標記下包含的所有子標記

}

jQuery 選擇器的通用語法
$(selector) $=jQuery

$(“#showDiv") —很簡潔!!
= javascript 中的 elementByid

類別選擇器
$(" .SomeClass")

$(“p=odd") / 選擇所有奇數行的

標記

$(“td=nth-child(1)") /所有表格行的第一儲存格就是第一列

$(“li>a") / 子選擇器,返回

  • 標記的所有元素 不包括孫標記

    $(“a[href$=pdf]") /選擇所有超連結是以’pdf"結尾的

    去首尾空格(最端和最戶端的空格清理掉): $.trim(sString)= jQuery.trim(sString)

    jQuery.ready() /自動將其中函數在頁面載入後完成後執行,並在同一頁面可用多個ready()方法,且不衝突.

    jQuery使用"$" 直接建立DOM元素. 例: var 0 newP=$(“

    “)

    解決"$"的衝突: jQuery.noConflict()

    CSS3 http://www.w3c.org/style/css

    使用選擇器
    屬性選擇器:用中括號[] 新增屬性

    廣告
  • 舊文章
    發表留言

    發表迴響

    在下方填入你的資料或按右方圖示以社群網站登入:

    WordPress.com Logo

    您的留言將使用 WordPress.com 帳號。 登出 / 變更 )

    Twitter picture

    您的留言將使用 Twitter 帳號。 登出 / 變更 )

    Facebook照片

    您的留言將使用 Facebook 帳號。 登出 / 變更 )

    Google+ photo

    您的留言將使用 Google+ 帳號。 登出 / 變更 )

    連結到 %s

    %d 位部落客按了讚: