Question

我尝试了解Ajax。我想了解数据和命令如何在代码中流动。我有以下代码。请在此代码中阅读我的评论。评论描述了我如何理解代码。这个问题被标记为问题!!!重要提示：代码正常，我只是试着理解代码。

<!DOCTYPE html>
<HTML>
    <HEAD>
        <META charset="UTF-8" />
        <TITLE>Test02</TITLE>
    </HEAD>
    <BODY>
        <p id="demo">Let AJAX change this text.</p>
        <button type="button" onclick="loadDoc()">Change Content</button>
        <SCRIPT>
            function loadDoc() {
                // select right object
                function createXhttp(){
                    var variable;
                    if (window.XMLHttpRequest) {
                        // code for modern browsers
                        variable = new XMLHttpRequest();
                    } else {
                        // code for IE6, IE5
                        variable = new ActiveXObject("Microsoft.XMLHTTP");
                    }

                    return variable;
                }


                var xhttp = createXhttp();
                // check the state
                xhttp.onreadystatechange = function (){
                    // if the response is ready and file or url exists
                    if (xhttp.readyState == 4 && xhttp.status == 200) {
                        /* display the text in console - but which text if xttp.open
                        with source file is opened on the next line? (PROBLEM!!!)*/
                        console.log(xhttp.responseText);
                    }
                };
                // use method get and load the content of ajax_info.txt
                xhttp.open("GET", "ajax_info.txt", true);
                // send the request above
                xhttp.send();
            }
        </SCRIPT>
    </BODY>
</HTML>

感谢您的建议。

Answer 1

但是如果在下一行打开带源文件的xttp.open哪个文本？

我们再举一个例子。

document.getElementById('some_button').onclick = function () {
    console.log(document.getElementById("some_text_box").value);
}

此时用户尚未在 some_text_box 中输入任何内容并不重要，因为在单击 some_button 之前该功能不会运行。

现在回到XHR：

xhttp.onreadystatechange = function (){
    if (xhttp.readyState == 4 && xhttp.status == 200) {
        console.log(xhttp.responseText);
    }
};

...请求尚未发送尚未并不重要，因为该功能在响应到达之前不会运行。

（好的，它会在每次就绪状态发生变化时运行，但是if语句意味着它的内容在响应到达之前不会运行。）

Ajax - 理解代码

1 个答案: