看下我哪里错了？？？
来源：2-7 利用Ajax实现新闻列表
兮兮666
2019-09-13 19:08:51
package com.imooc.ajax;
public class News {
private String title; //新闻标题
private String date; //发布日期
private String source; //发布来源
private String content; //新闻内容
public News() {
}
public News(String title, String date, String source, String content) {
super();
this.title = title;
this.date = date;
this.source = source;
this.content = content;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public String getDate() {
return date;
}
public void setDate(String date) {
this.date = date;
}
public String getSource() {
return source;
}
public void setSource(String source) {
this.source = source;
}
public String getContent() {
return content;
}
public void setContent(String content) {
this.content = content;
}
}
package com.imooc.ajax;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.alibaba.fastjson.JSON;
/**
* Servlet implementation class NewsListServlet
*/
@WebServlet("/new_list")
public class NewsListServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public NewsListServlet() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
List<News> list=new ArrayList<News>();
list.add(new News("大爆料，马云退役","2019-9-11","阿里云","。。。。。。。"));
list.add(new News("中秋佳节，到来","2019-9-13","腾讯","。。。。。。。"));
list.add(new News("国庆，即将到来","2019-9-14","网易","。。。。。。。"));
String json=JSON.toJSONString(list);
response.setContentType("text/html;charset=UTF-8");
response.getWriter().print(json);
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript">
//1.创建XMLHttpRequest
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}else{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
//2.发送Ajax请求
xmlhttp.open("GET","/ajax/new_list",true);
xmlhttp.send();
//3.处理服务器响应
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
var text=xmlhttp.responseText;
console.log(text);
var json=JSON.parse(text);
console.log(json);
var html="";
for(var i=0;i<json.length;i++){
var news=json[i];
html=html+"<h2>"+news.title+"</h1>";
html=html+"<h2>"+news.date+" "+news.source+"</h2>";
html=html+"<hr/>"
}
document.getElementById("container").innerHTML=html;
}
}
</script>
</body>
</html>
1回答
-
同学你好，复制运行贴出代码，错误原因是document.getElementById("container")没有获取到
这是因为在页面中并没有一个id为container的内容，所以这里也就获取不到，建议同学在页面中添加一个id为container的div
这样就可以正常显示啦。
如果我的回答解决了你的疑惑，请采纳，祝学习愉快~
0
相似问题