使用AJAX读取XML文件时出错 [英] Error when reading in an XML file using AJAX
本文介绍了使用AJAX读取XML文件时出错的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
当我尝试使用AJAX显示xml文件时，.html文件出现错误.我的程序应该有一个可以读取json文件的按钮和另一个可以读取xml文件的按钮.json按钮可以正常工作，但是xml按钮在我按时给我一个错误，我无法弄清楚.
I get an error in my .html file when I am trying to display an xml file using AJAX. My program is supposed to have a button that can read in a json file and another button that can read in an xml file. The json button works just fine, but the xml button gives me an error when I press it and I can't figure it out.
我遇到的错误
Uncaught TypeError: Cannot set property 'innerHTML' of null index.html:34
这是我的代码:
index.html
index.html
<!DOCTYPE html>
<html>
<head>
<title>AJAX - responseJSON</title>
<script src="ajax.js"></script>
<script>
function getMovies() {
var xmlHttp = xmlHttpObjCreate();
if (!xmlHttp) {
alert("The browser doesn't support this action.");
return;
}
xmlHttp.onload = function() {
if (xmlHttp.status == 200) {
// Get XML Document
var xmlDoc = xmlHttp.responseXML;
// Variable for our output
var output = '';
// Build output by parsing XML
movieTitles = xmlDoc.getElementsByTagName('title');
for (i = 0; i < movieTitles.length; i++) {
output += movieTitles[i].childNodes[0].nodeValue + "<br>";
}
// Get div object
var divObj = document.getElementById('movieBox');
// Set the div's innerHTML
divObj.innerHTML = output;
}
}
xmlHttp.open("GET", "movies.xml", true);
xmlHttp.overrideMimeType("text/xml")
xmlHttp.send();
}
function getContent() {
var xmlHttp = xmlHttpObjCreate();
if (!xmlHttp) {
alert("The browser doesn't support this action.");
return;
}
xmlHttp.onload = function() {
if (xmlHttp.status == 200) {
// Get Response Text
var response = xmlHttp.responseText;
// Prints the JSON string
console.dir(response);
// Get div object
var divObj = document.getElementById('contentBox');
// We used JSON.parse to turn the JSON string into an object
var responseObject = JSON.parse(response);
// This is our object
console.dir(responseObject);
// We can use that object like so:
divObj.innerHTML = "Hi I am " + responseObject.name + " and my pet is " + responseObject.pet;
}
}
xmlHttp.open("GET", "json.php", true);
xmlHttp.send();
}
</script>
</head>
<body>
<h3>My Content</h3>
<div id="contentBox"></div>
<button type="button" onclick="getContent();">Get Content</button>
<h3>My movies</h3>
<div id"movieBox"></div>
<button type="button" onclick="getMovies();"> Get Movies</button>
</body>
</html>
ajax.js
function xmlHttpObjCreate() {
var xmlHttp;
try
{xmlHttp=new XMLHttpRequest();
}
catch (e)
{try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
return false;
}
}
}
return xmlHttp;
}
movies.xml
movies.xml
<?xml version= "1.0"?>
<collection>
<movies>
<title> Gone with the Wind
<year> 1939 </year>
</title>
<title> 2001: A Space Odyssey
<year> 1968 </year>
</title>
<title> Jurassic Park
<year> 1993 </year>
</title>
<title> The Shawshank Redmption
<year> 1994 </year>
</title>
<title> Balto
<year> 1995 </year>
</title>
</movies>
</collection>
推荐答案
无效的HTML:
<div id"movieBox"></div>
^---missing =
没有 = ，没有有效的 id 属性，因此您的 getElementById()失败并返回 null 表示失败.
No =, no valid id attribute, therefore your getElementById() fails and returns null to signify failure.
这篇关于使用AJAX读取XML文件时出错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
