Javascript 用外部html站点替换Divs innerHTML

我有三个链接：

    <div class="btn-group btn-group-justified">
        <a class="btn btn-default" href="#" onclick="changeSite('all.html')">All</a>
        <a class="btn btn-default" href="#" onclick="changeSite('new.html')">New</a>
        <a class="btn btn-default" href="#" onclick="changeSite('random.html')">Random</a>
    </div>

---

借助此函数，我想将div的内容替换为id

siteContent

，替换为

all.html、new.html

或

random.html

的内容。这三个站点与my

index.html

一样位于同一文件夹中，代码实际上是在该文件夹中触发的。如何将

.innerHTML

设置为此网站之一的内容？谢谢

可选：当你说“外部站点”时，通常意味着资源托管在不同于为初始页面提供服务的服务器上。您的外部服务器需要配置为支持或响应适当的ajax，以允许跨站点ajax

然后，您可以使用或从站点请求数据，并将其放入模板中

您可以使用jQuery，但如果没有它，它非常简单：

var changeSite = function(pathName) {
  var r = new XMLHttpRequest();
  r.onreadystatechange = function() {
    if (this.readyState == 4) {
      document.getElementById("siteContent").innerHTML = this.responseText;
    }
  }
  r.open('get', pathName, true);
  r.send();
}

---

jquery加载函数允许您指定要加载的元素id

$('#<id to load html to>').load('xyz.html');

$（'#'）.load（'xyz.html'）；

$('#<id to load html to>').load('xyz.html');