jQuery笔记

阅读了Professional Ajax second editon，写些jQuery笔记;

jQuery是一个Ajax程序库，就像Java的API,它主要是提供了高级javaScript使用方式，通过封装和映射特殊字符，可以减少开发人员代码量;

访问方式样例:

$("p")访问所有的P元素,

$("div#myDiv")访问id为myDiv的div元素

$("input[@type=text]")访问type为text的input元素

$("p").hide()对所有的p元素作隐藏处理

$(div#myDiv").css("font-family","Arial");设置其样式

$("div#myDiv").width("400px")设置其宽度

 

$.get()样子:

        function requestCustomerInfo() {
        
            //get the ID
            var sId = $("input#txtCustomerId").val();
            //send the request
            $.ajax({
                type : "GET",
                url : "GetCustomerData.jsp?id=" + sId,
                success : function (oXHR, status) {
                    $("div#divCustomerInfo").html(oXHR);
                },
                error : function (oXHR, status) {
                    $("div#divCustomerInfo").html("An error occurred.");
                }            
            });
        }

 $.post()样子:

       function sendRequest() {
            var oForm = document.forms[0];
            var sBody = getRequestBody(oForm);
            
            //send the request
            $.ajax({
                type : "POST",
                url : "SaveCustomer.jsp",
                data: sBody,
                success : function (oXHR, status) {
                    $("div#divStatus").html(oXHR.responseText);
                },
                error : function (oXHR, status) {
                    $("div#divStatus").html("An error occurred.");
                }            
            });
        }

 $("xxElement").load()样子:

        function requestCustomerInfo() {
        
            //get the ID
            var sId = $("input#txtCustomerId").val();
            
            //send the request
            $("div#divCustomerInfo").load("GetCustomerData.jsp?id=" + sId);
        }

 $.ajax()样子:

       function requestCustomerInfo() {
        
            //get the ID
            var sId = $("input#txtCustomerId").val();
            //send the request
            $.ajax({
                type : "GET",
                url : "GetCustomerData.jsp?id=" + sId,
                success : function (oXHR, status) {
                    $("div#divCustomerInfo").html(oXHR);
                },
                error : function (oXHR, status) {
                    $("div#divCustomerInfo").html("An error occurred.");
                }            
            });
        }