jQuery源码中的Ajax--load方法

  load()方法是jQuery中最为简单和常用的方法,能载入远程HTML代码幷插入到DOM中,其结构为:

load(url [.data] [.callback])

  各参数解释如下:

参数名称 类型 说明
url String 请求HTML页面的URL地址
data(可选) Object 发送至服务器的key/value数据
callback(可选) Function 请求完成时的回调函数,无论请求成功或失败

  load的源码如下:(源码目录:jquery/src/ajax/load.js)

define( [
    "../core",
    "../core/parseHTML",
    "../ajax",
    "../traversing",
    "../manipulation",
    "../selector"
], function( jQuery ) {

"use strict";

/**
 * Load a url into a page
 */
jQuery.fn.load = function( url, params, callback ) {
    var selector, type, response,
        self = this,
        off = url.indexOf( " " );

    if ( off > -1 ) {
        selector = jQuery.trim( url.slice( off ) );
        url = url.slice( 0, off );
    }

    // If it‘s a function
    if ( jQuery.isFunction( params ) ) {

        // We assume that it‘s the callback
        callback = params;
        params = undefined;

    // Otherwise, build a param string
    } else if ( params && typeof params === "object" ) {
        type = "POST";
    }

    // If we have elements to modify, make the request
    if ( self.length > 0 ) {
        jQuery.ajax( {
            url: url,

            // If "type" variable is undefined, then "GET" method will be used.
            // Make value of this field explicit since
            // user can override it through ajaxSetup method
            type: type || "GET",
            dataType: "html",
            data: params
        } ).done( function( responseText ) {

            // Save response for use in complete callback
            response = arguments;

            self.html( selector ?

                // If a selector was specified, locate the right elements in a dummy div
                // Exclude scripts to avoid IE ‘Permission Denied‘ errors
                jQuery( "<div>" ).append( jQuery.parseHTML( responseText ) ).find( selector ) :

                // Otherwise use the full result
                responseText );

        // If the request succeeds, this function gets "data", "status", "jqXHR"
        // but they are ignored because response was set above.
        // If it fails, this function gets "jqXHR", "status", "error"
        } ).always( callback && function( jqXHR, status ) {
            self.each( function() {
                callback.apply( this, response || [ jqXHR.responseText, status, jqXHR ] );
            } );
        } );
    }

    return this;
};

} );

  整个源码的工作如下:

时间: 2024-10-10 06:20:15

jQuery源码中的Ajax--load方法的相关文章

jQuery源码中的Ajax--get()/post()方法

load()方法通常用来在web服务器上获取静态的数据文件,如果需要传递一些参数给服务器中的页面,那就可以使用$.get()方法或$.post()方法. *$.get()方法和$.post()方法是jQuery中的全局函数 一.$.get()方法 $.get()方法是使用GET方式来进行异步请求.结构为: $.get(url [.data] [.callback] [.type]) 参数解释如下: 参数名称 类型 说明 url String 请求的HTML页的url地址 data(可选) Obj

jQuery源码中的Ajax--getScript()/getJson()方法

一.$.getScript()方法 有时候,在页面初次加载时就取得所需的全部Javascript文件是完全没必要的,可以按需所取. 该函数用于动态加载JS文件,并在全局作用域下执行文件中的JS代码. 该函数可以加载跨域的JS文件.请注意,该函数是通过异步方式加载数据的. 该函数属于全局jQuery对象. 语法: $(function(){ $("send").on("click",function(){ $.getScript("script.js&quo

关于jQuery源码中(function(window,undefined){//dosomething()})(window)写法解释

一.首先是最常见的闭包 (Closure) 范式自执行函数的写法,这里用匿名函数封装(构造块级作用域),避免了匿名函数内部的代码与外部之间发生冲突(如使用了相同的变量名). 1 (function() {// ...})(); 二.自执行函数和其他函数类似,都可以传入参数:jQuery源码中将window作为一个参数传入, window是DOM对象模型的最顶层对象,把全局变量传进来,就避免了到外层去寻找,提高效率: 1 (function(window) {// ...})(window); 当

jQuery源码中的Ajax--serialize()/serializeArray()/param()方法

由于jQueryObject.serialize()方法的核心是$.param()方法,所以先学习$.param()方法. 一.$.param()方法 $.param()方法是用来对一个数组或对象按照key/value进行序列化,以便用于URL查询字符串或AJAX请求.其返回的字符串已经过URL编码处理(采用的字符集为UTF-8). 语法: jQuery.param( obj [, traditional ] ) 参数如下: 参数 描述 obj 需要被序列化的JS对象. traditional

Jquery源码中的Javascript基础知识(四)— jQuery.fn.init方法

$() 即调用了jQuery.fn.init方法 jQuery = function( selector, context ) { return new jQuery.fn.init( selector, context, rootjQuery ); } 下面是init方法代码: 1 init: function( selector, context, rootjQuery ) { 2 var match, elem; 3 if ( !selector ) { 4 return this; 5

在看 jquery 源码中发现的一些优化方向

1. 避免使用 $.fn.each 或 $.each 因为它比原生的 for/while 真的会慢一些,循环次数越多差距越大. 另外,对象的 for-in 比 for 是要快一丢丢的,但数组的 for-in 要比 for 慢 2. 选择器 始终要相信,原生的普遍要快一些,因此 jquery 也是如此, id 选择器 $('#id') / 元素标签选择器 $('input') / 类选择器 $('.class') 都是原生的 而伪类选择器 $(':hidden') / 属性选择器 $('[data

关于jquery源码中undefined作为参数的理解

大家先看一下,下面代码 (function (window,undefined) {window.alert('zhangling');var person = {};person.addName = function () { };person.addAge = function () { };})(window) 压缩后: (function(a,b){a.alert('zhangling');var c={};c.addName=function(){};c.addAge=function

jquery源码中的(function(window, undefined){})(window)【转】

(function( window, undefined ) {})(window);这个,为什么要将window和undefined作为参数传给它? (function( $, undefined ) {})(jQuery); 同理 因为 ecmascript 执行JS代码是从里到外,因此把全局变量window或jQuery对象传进来,就避免了到外层去寻找,提高效率.undefined在老一辈的浏览器是不被支持的,直接使用会报错,js框架要考虑到兼容性,因此增加一个形参undefined. 还

ABP框架源码中的Linq扩展方法

文件目录:aspnetboilerplate-dev\aspnetboilerplate-dev\src\Abp\Collections\Extensions\EnumerableExtensions.cs using System; using System.Collections.Generic; using System.Linq; namespace Abp.Collections.Extensions { /// <summary> /// Extension methods for