Question

我正在建立一个网站，用户可以在该网站上发布请求，其他人可以进行响应。我建立了一个类似于应用程序的表单来收集信息。在那种形式下，我需要显示3页。

所以我创建了一个页面，其中包含from和和一个JavaScript文件来处理这3个页面。其他表单页面是单独设计的（仅HTML）。

我打算使用XMLHttpRequest将其他两个页面加载到第一页中，并且可以使用。

但是我需要将第三页带入第一表单页面（显示表单的第三页）并更改该第三页面的innerHTML。我尝试过

function setFinalDetails() {
  document.getElementById("topic").innerHTML = object1.start;
}

//creating a XMLHttpObject and sending a request
//requiredPage is the page we request. 
//elementId is the element we need to display

function requestAPage(requiredPage) {

  selectElementId(requiredPage);
  var xhttp = new XMLHttpRequest();


  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      m = xhttp.responseXML;
      y = m.getElementById(elementId).innerHTML;
      document.getElementById("hireForm").innerHTML = y;

      //m is a global variable
      //m is the object recieved from XMLHttpRequest.
      //it is used to change the innerHTML of itself(m) and display.

      //y is displaying the 3rd page in the form-page one("id =hireForm")

      return m;
    }
  };

  xhttp.open("GET", requiredPage, true);
  xhttp.responseType = "document";
  xhttp.send();
}

但是会出现错误：

无法将.innerHTML属性设置为null

在https://github.com/infinitecodem/Taxi-app-form.git上找到我的工作

Answer 1

很难提供详细的帮助，因为我们没有办法重现您的错误并测试您的代码。我建议您使用plunker之类的服务来共享您的代码。我不知道此服务是否支持在其工作树中的其他文件上执行xhrRequest，您可以尝试。

您的错误消息似乎表明您的document.getElementById(...)之一返回null而不是您想要的html elt（因此该ID在页面中不存在）。

但是同样，如果没有测试的方法，很难帮助您更加自信。我真的鼓励您尝试共享指向服务的链接（如插件），以帮助其他人使用您的用例。

如何从另一个HTML文档中获取HTML元素并显示在当前文档中？

1 个答案: