AJAX遇到的问题
Posted 唥小雨
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了AJAX遇到的问题相关的知识,希望对你有一定的参考价值。
AJAX遇到的问题
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AJAX</title>
</head>
<body>
<div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div>
<button type="button" onclick="loadXMLDoc()">修改内容</button>
</body>
<script>
function loadXMLDoc(params) {
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange= function() {
if(xmlhttp.readyState== 4&& xmlhttp.status== 200){
var text =xmlhttp.responseText;
var result =JSON.parse(text);
var arraymes =result.message;
console.log(arraymes)
var box="<div>"
for(var i=0; i<=arraymes.length; i++){
var name =arraymes[i].name;
console.log(name)
console.log(arraymes[i].image_src)
box +='<span>'+arraymes[i].name+'<span>';
box += "<image src="+arraymes[i].image_src+"/>";
box += "<br>"
}
box+="</div>"
console.log(box)
document.getElementById("myDiv").innerHTML=box;
// console.log(arraymes);
}
}
xmlhttp.open("GET","https://api-hmugo-web.itheima.net/api/public/v1/home/catitems",true);
xmlhttp.send();
}
</script>
</html>
最后解决了
问题是:
在数组遍历的时候多打了个“=”导致下标找不到
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AJAX</title>
</head>
<body>
<div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div>
<button type="button" onclick="loadXMLDoc()">修改内容</button>
<image class="" src="" mode="aspectFit|aspectFill|widthFix" />
</body>
<script>
function loadXMLDoc(params) {
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange= function() {
if(xmlhttp.readyState== 4&& xmlhttp.status== 200){
var text =xmlhttp.responseText;
var result =JSON.parse(text);
var arraymes =result.message;
console.log(arraymes)
var box="<div>"
for(var i=0; i<arraymes.length; i++){
// var name =arraymes[i].name;
box +='<span>'+arraymes[i].name+'<span>';
box += '<image src="'+arraymes[i].image_src+'"/>';
box += "<br>"
}
box+="</div>"
console.log(box)
document.getElementById("myDiv").innerHTML=box;
// console.log(arraymes);
}
}
xmlhttp.open("GET","https://api-hmugo-web.itheima.net/api/public/v1/home/catitems",true);
xmlhttp.send();
}
</script>
</html>
以上是关于AJAX遇到的问题的主要内容,如果未能解决你的问题,请参考以下文章