Question

我只是一个尝试学习一些AJAX的初学者所以我的问题可能是愚蠢的。当我在浏览器中打开此文档时，单击页面上的按钮并显示错误“Uncaught TypeError：无法设置属性'innerHTML'为null”。我试图解决这个问题，甚至删除了具有innerHTML属性的行，并且涉及innerHTML的相同错误不断出现，那怎么可能呢？我会感激一些帮助。

    <!doctype html>
<html>
<head>
    <script type="text/javascript">

    function cargaXML(){

        var conexion;
        var txt,x,i;

        if(window.XMLHttpRequest){
                        conexion = new XMLHttpRequest();
                    } else {
                        conexion = new ActiveXObject("Microsoft.XMLHTTP");
                    }



        conexion.onreadystatechange = function(){
            if (conexion.readyState == 4 && conexion.status == 200){
                xmlDoc = conexion.responseXML;
                txt = "<table>";
                x = xmlDoc.getElementsByTagName("titulo");
                artista = xmlDoc.getElementsByTagName("artista");
                pais = xmlDoc.getElementsByTagName("pais");
                firma = xmlDoc.getElementsByTagName("firma");
                precio = xmlDoc.getElementsByTagName("precio");
                anio = xmlDoc.getElementsByTagName("anio");

                for (i=0;i<x.length;i++){
                    txt = txt + "<tr><td>" + x[i].childNodes[0].nodeValue + "</td><tr>" + artista[i].childNodes[0].nodevalue + "</td><td>" + pais[i].childNodes[0].nodevalue + "</td><td>" + firma[i].childNodes[0].nodevalue + "</td><td>" + precio[i].childNodes[0].nodevalue + "</td><td>" + anio[i].childNodes[0].nodevalue + "</td>";
                }
                txt = txt + "</table>";
                document.getElementById("myDiv").innerHTML = txt;
            }

            conexion.open("GET","discos.xml",true);
            conexion.send();
        }

        }

    </script>
</head>
<body>
    <h2>Mi colección</h2>
    <div id="myDiv">



    </div>

    <button type="button" onclick="cargaXML()">Tomar mi colección</button>
</body>
</html>

Answer 1

尝试将所有内容放在按钮下方的脚本标记中，因为页面中的所有内容都按逻辑顺序加载，因此您有

的JavaScript
HTML

它甚至在呈现之前尝试访问HTML标记，因此它应该

HTML
的JavaScript

或在整个脚本周围添加一个body onload，以便在尝试使用之前等待文档加载

Answer 2

问题是在将“myDiv”打印到页面之前javascript正在运行。通常使用jQuery和$（document）.ready调用来纠正这个问题。在javascript中，您可以在窗口上使用onload属性：

window.onload = cargaXML;

未捕获的TypeError：无法在ajax中设置null的属性'innerHTML'

2 个答案: