加载给定url的html内容，并在JavaScript中精确放置（如document.write（））

我想编写一个JavaScript代码，加载给定URL的HTML内容，并将加载的HTML代码放在脚本所在的位置。（也许这看起来像是iframe标记的功能，但我不希望“iframe标记”成为一种媒介。我只想加载html代码并将其放置在那里，而不添加任何容器或额外的父级） 大概是这样的：

var url = "http://example.com/";    
var html = loadhtmlcontents(url); // something like simplexml_load_file($url) for php and xml
document.write(html); // somthing like saveHTML() in DOMDocument class of php

我尝试过AJAX方法，但不起作用：

    var xmlhttp=new XMLHttpRequest();
    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.wirte( xmlhttp.responseText);
        }
    }
    xmlhttp.open("GET", Url, false );
    xmlhttp.send();

你能给我一个相等的或更正这些吗？（对于我来说，在这种情况下，纯JS方法比JQuery更可取）

获取属性是可能的，但这里有另一种方法（请记住，它用

id

标记替换整个元素）：

在

正文

标记中：

<script id='test'>docWrite('test', '/echo/html')</script>

在这里，我所做的只是复制

id

相关标记的内容（没有

responseText

可显示）。在您的使用中，您可以这样做：

function docWrite(id, url) {       
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState == 4 
             && xmlhttp.status == 200) {
            var el = document.getElementById(_id)
                div = document.createElement('div');

            div.id = _id;
            div.appendChild(xmlhttp.responseText);

            el.parentNode.insertBefore(div, el.nextSibling);
            el.parentNode.removeChild(el);
        }
    }

    xmlhttp.open("GET", url, false );
    xmlhttp.send();
}

---

我知道您正在寻找一个无jQuery的版本。。。但是我要先发这个。。。只是为了说明它有多简单（它围绕着浏览器在进行AJAX调用、处理回调等方面的差异而工作）

$（'#someID'）.load（'someurl.html'）；

我会直接在脚本中添加一个div。。。然后调用AJAX并将返回的内容附加到div。这样就添加了一个div父级。有没有比document.write（）更好的解决方案？或者对我的代码plz进行任何修改？是的，修复.wirte（）拼写错误，浏览器js控制台是你的朋友！这就是我正在做的。你看到小提琴了吗？如果你能自己摆弄你所拥有的，我可以看一看。我用小提琴中的你的url替换了我的url，但它不起作用。你应该使用我展示的第二个功能，首先（请参阅）。其次，在JSFIDLE中使用自己的url可能会出现跨域错误；这就是我在示例中使用位于

/echo/html

的JSFIDLE的原因。确保您在目标元素的属性和

docWrite（）

调用中拥有正确的

id

，并查看Javascript控制台和网络日志中的错误。噢！AJAX似乎无法从另一台服务器发送和接收数据。正确的？如果是的话，AJAX方法对我来说失败了很多。它非常简单和简短。但我不能保证复制和粘贴我的代码、使用JQUERY并包含其库的客户端。我能解释一下我的问题吗？啊，那么您正试图提供一个脚本标记片段，其他开发人员可以将其复制/粘贴到他们希望您的“小部件”出现的代码中？是这样吗？

function docWrite(id, url) {       
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState == 4 
             && xmlhttp.status == 200) {
            var el = document.getElementById(_id)
                div = document.createElement('div');

            div.id = _id;
            div.appendChild(xmlhttp.responseText);

            el.parentNode.insertBefore(div, el.nextSibling);
            el.parentNode.removeChild(el);
        }
    }

    xmlhttp.open("GET", url, false );
    xmlhttp.send();
}

<div id="someID"></div>
<script>$('#someID').load('someurl.html');</script>