Question

我正在按照本教程使用Javascript加载文件。我已经按照教程并没有加载文件。这是我的代码：

<script type="application/javascript"
        src="http://server2.example.com/Users/1234">
</script>

现在在本教程中（Here）它说它应该将文件加载到div中。你们知道发生了什么吗？

Answer 1

正在加载JSON

您提到的“教程”是JSON上的Wiki页面。您提供的代码行完全从该页面复制，如果您正确阅读了内容，则不是在讨论从javascript加载 HTML 文件，而是加载 JSON数据来自Javascript。

实际上，页面清楚地表明这种方法不允许您访问JSON数据，因为它没有被分配来做任何事情，即使它确实将数据作为对象加载，你也没有指向它的指针对象！

相反，同一页面建议使用类似

的内容

<script type="application/javascript"
      src="http://server2.example.com/Users/1234?jsonp=parseResponse">
</script>

这样您就可以将函数parseResponse与数据一起使用。

正在加载HTML

由于您要加载一些额外的HTML，因此在加载页面后，您应该执行以下操作：

示例代码：（部分从我给你的页面复制）

<script type="text/javascript">
  function loadXMLDoc(filename) {
    var xmlhttp;
    if (window.XMLHttpRequest)  {
      xmlhttp=new XMLHttpRequest();
    }
    else {
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
      if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        after_load_function(xmlhttp.responseText);
      }
    }
    xmlhttp.open("GET",filename,true);
    xmlhttp.send();
    }

    function after_load_function(responseText) {
      document.getElementById("myDiv").innerHTML = responseText;
    }

    window.onload = function() {
      loadXMLDoc("your_html_filename.html");
    }
</script>

Answer 2

你可以使用jquery ajax或get函数来获取给定网址的数据并将该数据打印到给定的div

<script type="application/javascript">
$.get( "http://server2.example.com/Users/1234?jsonp=parseResponse"
       ,function( data ) {
                        $( "body" ).append( "Name: " + data.name ) // John
                        .append( "Time: " + data.time ); //  2pm
                        }
       ,"json" );
</script>

有关详细信息Jquery.get()

，请参阅此链接

使用JS加载HTML文件

2 个答案: