使用 ajax 将 HTML 文档附加到元素

Append HTML doc to element using ajax

本文关键字：元素 文档 ajax HTML 使用      更新时间：2023-09-26

我已经使用各种在线资源编写了这段代码，但我似乎无法弄清楚最后一部分。

function loadajax (event) {
    event.preventDefault();
    xhr = new XMLHttpRequest();
    xhr.onreadystatechange  = function(){ 
        if(xhr.readyState  == 4){
            if(xhr.status  == 200) 
                document.ajax.dyn="Received:"  + xhr.responseText; 
            else
                document.ajax.dyn="Error code " + xhr.status;
        }
    }; 
    xhr.open('GET', this.href, true);
    var content = document.getElementsByTagName('article')[0];
    content.innerHTML = xhr.responseText;
}

它似乎有效，直到我需要向我的页面添加内容。事实上，content.innerHTML = xhr.responseText;什么也没返回。我得到了一个简单的HTML文件，如何将其发布到我的页面中？我做错了什么？

感谢您的帮助！

ajax 调用是异步的。 如果您将content.innerHTML = xhr.responseText;行移动到 onreadystatechange 函数中，如下所示，它将起作用：

function loadajax (event) {
event.preventDefault();
xhr = new XMLHttpRequest();
 xhr.onreadystatechange  = function() 
    { 
       if(xhr.readyState  == 4)
       {
        if(xhr.status  == 200) 
            document.ajax.dyn="Received:"  + xhr.responseText; 
            content.innerHTML = xhr.responseText;
        else
            document.ajax.dyn="Error code " + xhr.status;
        }
    }; 
xhr.open('GET', this.href, true);
var content = document.getElementsByTagName('article')[0];
}

将 contet.innerHTML 置于状态 200 条件中。

您只是在内容真正存在之前将值分配给内容。在 ajax 从服务器获取它之前。

相关文章：