个人中心
gpt4 book ai didi

jquery - 查询 Javascript 库

转载 作者：塔克拉玛干 更新时间：2023-11-02 21:47:05 26 4
gpt4 key购买 nike

我一直在尝试研究 javascript 库的工作原理，以便在总体上有一个更好的想法，但我并不真正理解它们。我对java和javascript有一点编程知识，但下面的代码对我来说还是有点复杂。我从 david-tang.net 网站上的示例中提取了这段代码。虽然里面有解释，但是看了之后，还是有点懵。那里有人可以帮助我吗？提前致谢。

/*
 * ajax static method
 * example:
 * dQuery.ajax({
        url: 'ajaxResponse.php',
        data: 'fname=David&age=25',
        success: function (response) {}
    });
 */

dQuery.ajax = (function () {
    var xhr;
if (typeof XMLHttpRequest !== 'undefined') {
    xhr = new XMLHttpRequest();
}
else {
    var IEversions = ["Microsoft.XmlHttp",
                    "MSXML2.XmlHttp",
                    "MSXML2.XmlHttp.3.0",
                    "MSXML2.XmlHttp.4.0",
                    "MSXML2.XmlHttp.5.0"];

    for(var i=0, len = IEversions.length; i<len; i++) {
        try {
            xhr = new ActiveXObject(IEversions[i]);
            break;
        }
        catch(e) {
        }
    }      
}

return function (param) {
    var url = param.url+'?'+param.data;    
    function checkReadiness () {
        if (xhr.readyState < 4) {
            return;
        }
        else if (xhr.readyState === 4 && xhr.status === 200) {
            param.success(xhr.responseText);
        }
        else if (xhr.status !== 200) {
            alert('Ajax request failed');
        }
    }

    xhr.onreadystatechange = checkReadiness;
    xhr.open('get', url, true);
    xhr.send('');
}
})();

来源:[http://david-tang.net/]

dQuery.ajax({
        url: 'ajaxResponse.php',
        data: 'fname=David&age=25',
        success: function (response) {}
    });



return function (param) {
    var url = param.url+'?'+param.data;    
    function checkReadiness () {
        if (xhr.readyState < 4) {
            return;
        }
        <b> 
            else if (xhr.readyState === 4 && xhr.status === 200) {
            param.success(xhr.responseText); 
        </b>
        }
        else if (xhr.status !== 200) {
            alert('Ajax request failed');
        }
    }

    xhr.onreadystatechange = checkReadiness;
    xhr.open('get', url, true);
    xhr.send('');
}

这是否意味着当 readyState 为 4 且 xhr.status 为 200 时，success 函数映射到 param.success？但是将参数返回给函数的那一行在哪里？这样，无论何时在 javascript 中调用 success:function(response) {}，响应都是参数？

在 testQuery.js 中

(function (window, undefined) {

var testQuery = function(obj) {
    if (!(this instanceof testQuery)) {
        return new testQuery(obj);
}


testQuery.alertMessage = (function () {
    alert("alert");
})();

}) (window);

在 testQuery.html 中

<html>
<head>

<script src="testQuery.js"></script>
<script>

function click() {

testQuery.alertMessage({});

}

<body>

<input type="button" value="click" onclick="click()">

</body>
</html>

最佳答案

首先，他们创建了一个闭包。这是一个基本上可以包含要执行的所有内容并最终返回一些内容的函数。返回的内容设置为 dQuery.ajax :

dQuery.ajax = (function() {
    // ...
})();

在闭包中，他们首先创建一个引擎，以便在发出 AJAX 请求时使用。在所有正常的浏览器中，引擎是 XMLHttpRequest .在 Internet Explorer 中，您需要尝试许多其他方法，包括 ActiveX 对象，这是他们接下来要做的(遍历所有可用于 AJAX 的 ActiveX 对象，并查看它是否可用)。

然后，他们返回一个函数，该函数将存储在 dQuery.ajax 中(因为它是闭包返回的东西)。此函数首先连接 URL 和查询字符串，因此 test.php和 foo=bar成为有效的 URL test.php?foo=bar .

之后，他们创建了一个函数(在返回函数内 - 这是可能的)，每次 AJAX 引擎状态更改时都会触发该函数。关键是它比你想要的更频繁地触发这个事件。你基本上只想在收到响应并且一切正确的情况下做一些事情。所以他们中断了这个功能以防readyState < 4 .当状态为 4并且 HTTP 响应代码是 200 (这是 OK - 如此成功)，他们调用通过 param 传递的函数参数，然后将响应文本传递给该函数。

在该函数之外，他们只是触发请求。

所以，如果你这样调用:

dQuery.ajax({
             type:"POST",
             url: "ajax.php",
             data:"id="+id ,
             success: function(data){
                 //response is in the data
            });

那么URL就变成了ajax.php?id=123 (取决于 id 的值)，请求被触发(使用 GET，因为 param.type 无处使用 - 您是否遗漏了什么？)，当它完成时， success调用函数的位置 data是响应文本。

编辑:在函数中，如果参数是函数，则可以调用它:

function foo(func) {
    func(12); // Call the function and pass 12 as its first argument
}

function addone(x) {
    alert(x + 1); // When arrived here, x === 12
}

foo(addone); // This will eventually alert 13

Edit2:回应您发布的内容:

(function (window, undefined) { // Start the closure, good

var testQuery = function(obj) { // Create a testQuery object, fine
    if (!(this instanceof testQuery)) {
        return new testQuery(obj);
}


testQuery.alertMessage = (function () { // Add a function, OK
    alert("alert");
})();

}) (window); // Oops - end of closure already.
             // Things have been defined but not exposed.
             // Just do window.testQuery = testQuery before the end of the closure,
             // so that you can actually use testQuery outside the closure.
             // Currently, testQuery is only accessible inside the closure, but
             // obviously you'd like to use it anywhere.

Edit3:您通过调用定义了一个函数。那真的没有必要。只是做(就像你定义 testQuery ):

testQuery.alertMessage = function () {
    alert("alert");
};

其次，你没有关闭}的 if子句:

if (!(this instanceof testQuery)) {
    return new testQuery(obj);
} // <-- important!

然后它按预期工作:http://jsfiddle.net/UFfSf/ .

关于jquery - 查询 Javascript 库，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6388964/

26 4 0
文章推荐： javascript - OAuth，request_token 上的 403 响应错误
文章推荐： objective-c - 在 XCode 中从调试器获取更好的描述性数据
文章推荐： android - 解码父 View SavedState 时恢复 View SavedState 抛出 ClassNotFoundException
文章推荐： ios - 为注释创建自定义标注
塔克拉玛干
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com