个人中心
gpt4 book ai didi

使用 AJAX 时 JavaScript Document.Write 替换所有正文内容

转载 作者：行者123 更新时间：2023-12-03 01:58:16 26 4
gpt4 key购买 nike

我正在创建一个简单的 ajax 调用，用于检索指定 url 的内容并将其写入页面。我遇到的问题是它用此信息替换了整个正文内容

这是 JS:

(function(){
    var mb = window.mb = {};

    function get_ad(url, parameters){
        var result = "";
        var http_request = false;

        if (window.XMLHttpRequest) { // Mozilla, Safari,...
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) {
                http_request.overrideMimeType('text/html');
            }
        } else if (window.ActiveXObject) { // IE
            var avers = ["Microsoft.XmlHttp", "MSXML2.XmlHttp", "MSXML2.XmlHttp.3.0", "MSXML2.XmlHttp.4.0", "MSXML2.XmlHttp.5.0"];
            for (var i = avers.length -1; i >= 0; i--) {
                try {
                    http_request = new ActiveXObject(avers[i]);
                    if (http_request){
                        break;  
                    }
                } catch(e) {}
            }
        }
        if (!http_request) {
            alert('Cannot create XMLHTTP instance');
            return false;
        }

        http_request.onreadystatechange = function(){
                                              if (http_request.readyState == 4) {
                                                 if (http_request.status == 200) {
                                                    gen_output(http_request.responseText);
                                                 } else {
                                                    alert('Error');
                                                 }
                                              }
                                           }

        http_request.open('GET', url + parameters, true);
        http_request.send(null);
    }

    function gen_output(ad_content){
        document.write("<div id=\"mb_ad\">");
        document.write(ad_content);
        document.write("</div>");
    }

    get_ad("http://localhost/test/test.html", "");
})();

这是 html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
    i am text before <br/>
    <script type="text/javascript" src="mb.js"></script>
    <br />
    i am text after 
</body>
</html>

使用firebug检查，我看不到之前或之后的文本，只是<div id="mb_ad">以及 test.html 页面中的内容。如果我删除 ajax 调用并只执行 3 document.writes之前的文本和之后的文本将正确显示。 jQuery 不是一个选择，我必须在没有大型库帮助的情况下做到这一点，因为大小和速度至关重要。

最佳答案

文档加载完成后，您将无法使用 document.write。如果这样做，浏览器将打开一个新文档来替换当前文档。

使用 innerHTML 属性将 HTML 代码放入元素内:

function gen_output(ad_content){
  document.getElementById('mb_ad').innerHTML = ad_content;
}

将元素放在脚本之前，以便在调用回调函数时确定它存在:

i am text before
<div id="mb_ad"></div>
i am text after
<script type="text/javascript" src="mb.js"></script>

将脚本放在哪里并不重要，因为不会将任何内容写入其所在的文档中。

关于使用 AJAX 时 JavaScript Document.Write 替换所有正文内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2360076/

26 4 0
文章推荐： javascript - 查询参数中具有相同键的多个字段(axios 请求)？
文章推荐： sql-server-2008 - 如何在 SQL Server 2008 中重新设置表标识并安全地撤消它？
文章推荐： JavaScript insideHTML 不更新元素
文章推荐： r - ggplot2:如何标记事件发生的日期
行者123
个人简介

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

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