Javascript 显示加载，直到页面完全加载

我有一个javascript：

function createRequestObject(){
    var req;
    if(window.XMLHttpRequest){
        //For Firefox, Safari, Opera
        req = new XMLHttpRequest();
    }
    else if(window.ActiveXObject){
        //For IE 5+
        req = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else{
        //Error for an old browser
        alert('Your browser is not IE 5 or higher, or Firefox or Safari or Opera');
    }
    //alert (req);
    return req;
}

//Make the XMLHttpRequest Object
var http = createRequestObject();

function sendRequestTwo(method, url, head1){
    head = head1
    if(method == "get" || method == "GET"){
        http.open(method,url);
        http.onreadystatechange = handleResponseTwo;
        http.send(null);

    }
}

var head; //divs name

function handleResponseTwo(){
    if(http.readyState == 4 && http.status == 200){
        var response = http.responseText;
        if(response){  
            document.getElementById(head).innerHTML = response;
        }
    }      
}

这部分

            document.getElementById(head).innerHTML = response;

将结果粘贴回我的页面。

---

如何在页面完全加载之前显示“加载”？

我不知道HTML的详细信息，但您不能将加载放在带有

id=“head”

的标记中吗

---

然后，当您更新innerHTML时，加载将自动被替换。如果您有更多的要求，请描述。

我不知道您的HTML的详细信息，但是您不能将加载放在带有

id=“head”

的标记中吗

---

然后，当您更新innerHTML时，加载将自动被替换。如果您有更多要求，请描述。

您可以在

sendRequestTwo

时将加载打印到Head div中。您可以在

sendRequestTwo

时将加载打印到Head div中，在body中加载Html怎么样

<div id="loadingDiv" class="hiddenClass">Fancy rotating image goes here</div>

然后

document.getElementById(head).innerHTML = response;

加

全部

function createRequestObject(){
    var req;
    if(window.XMLHttpRequest){
        //For Firefox, Safari, Opera
        req = new XMLHttpRequest();
    }
    else if(window.ActiveXObject){
        //For IE 5+
        req = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else{
        //Error for an old browser
        alert('Your browser is not IE 5 or higher, or Firefox or Safari or Opera');
    }
    //alert (req);
    return req;
}

//Make the XMLHttpRequest Object
var http = createRequestObject();

function sendRequestTwo(method, url, head1){
    head = head1
    if(method == "get" || method == "GET"){
        var myDiv = document.getElementById('loadingDiv');
        myDiv.className = "showClass";

        http.open(method,url);
        http.onreadystatechange = handleResponseTwo;
        http.send(null);

    }
}

var head; //divs name

function handleResponseTwo(){
    if(http.readyState == 4 && http.status == 200){
        var response = http.responseText;
        if(response){  
            document.getElementById(head).innerHTML = response;
            var myDiv = document.getElementById('loadingDiv');
            myDiv.className = "hiddenClass";
        }
    }      
}

---

在主体中加载Html时使用Div怎么样

<div id="loadingDiv" class="hiddenClass">Fancy rotating image goes here</div>

然后

document.getElementById(head).innerHTML = response;

加

全部

function createRequestObject(){
    var req;
    if(window.XMLHttpRequest){
        //For Firefox, Safari, Opera
        req = new XMLHttpRequest();
    }
    else if(window.ActiveXObject){
        //For IE 5+
        req = new ActiveXObject("Microsoft.XMLHTTP");
    }
    else{
        //Error for an old browser
        alert('Your browser is not IE 5 or higher, or Firefox or Safari or Opera');
    }
    //alert (req);
    return req;
}

//Make the XMLHttpRequest Object
var http = createRequestObject();

function sendRequestTwo(method, url, head1){
    head = head1
    if(method == "get" || method == "GET"){
        var myDiv = document.getElementById('loadingDiv');
        myDiv.className = "showClass";

        http.open(method,url);
        http.onreadystatechange = handleResponseTwo;
        http.send(null);

    }
}

var head; //divs name

function handleResponseTwo(){
    if(http.readyState == 4 && http.status == 200){
        var response = http.responseText;
        if(response){  
            document.getElementById(head).innerHTML = response;
            var myDiv = document.getElementById('loadingDiv');
            myDiv.className = "hiddenClass";
        }
    }      
}

---

基本上就是这样做的，但是

响应

需要时间来加载；如何检查它是否已完全加载？要查看是否加载了

response

，只需检查

http.readyState==4

。但我想你说的是别的。在

response

HTML中是否还有其他东西需要加载，比如图像？这差不多就是这样做的，但是

response

加载需要时间；如何检查它是否已完全加载？要查看是否加载了

response

，只需检查

http.readyState==4

。但我想你说的是别的。在

response

HTML中是否还需要加载其他类似图像的内容？您应该确保正确返回了Ajax响应。如果是这样，语句“document.getElementById（head）.innerHTML=response”将替换“loading”的内容。您应该确保正确返回Ajax响应。如果是这样，语句“document.getElementById（head）.innerHTML=response”将替换“loading”的内容