请问老师我这种写法怎样清除前面的内容呢?
来源:3-6 自由编程
菜菜菜好了没
2019-03-22 17:30:38
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <table width="100%"> <tr> <td width="33%"><button id="fashion" style="width:100%;">流行歌曲</button></td> <td width="33%"><button id="classics" style="width:100%;" >经典歌曲</button></td> <td width="33%"><button id="rock" style="width:100%;">摇滚歌曲</button></td> </tr> </table> <div id="show" style="text-align: center;"></div> </body> <script type="text/javascript" src="js/jquery-3.3.1.js"></script> <script type="text/javascript"> $("#fashion, #classics, #rock").click(function(){ $.ajax({ "url" : "/ajax/song_list", "type" : "get", "data" : "t="+this.id, "dataType" : "json", "success" : function(json){ console.log(json); for(var i = 0; i < json.length; i++){ $("#show").append("<h1>" + json[i].songs + "</h1>"); //append追加 } }, "error" : function(xmlhttp, errorText){ //errorText为报错文本 if(xmlhttp.status == "405"){ alert("无效的请求方式!"); }else if(xmlhttp.status == "404"){ alert("未找到URL资源!"); }else if(xmlhttp.status == "500"){ alert("服务器内部错误,请联系管理员!"); }else{ alert("产生异常,请联系管理员!"); } } }); });
package com.fangmz.content; 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; @WebServlet("/song_list") public class SongListServlet extends HttpServlet { private static final long serialVersionUID = 1L; protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String type = request.getParameter("t"); List list = new ArrayList(); if(type != null && type.equals("fashion")) { list.add(new Song("稻香")); list.add(new Song("晴天")); list.add(new Song("告白气球")); }else if(type != null && type.equals("classics")) { list.add(new Song("千千阙歌")); list.add(new Song("傻女")); list.add(new Song("七友")); }else if(type != null && type.equals("rock")) { list.add(new Song("一块红布")); list.add(new Song("假行僧")); list.add(new Song("新长征路上的摇滚")); } String json = JSON.toJSONString(list); response.setContentType("text/html;charset=utf-8"); response.getWriter().println(json); } }
package com.fangmz.content;
public class Song {
private String songs;
public String getSongs() {
return songs;
}
public void setSongs(String songs) {
this.songs = songs;
}
public Song() {
}
public Song(String songs) {
super();
this.songs = songs;
}
}
1回答
同学你好。
可以在ajax代码的成功处理中,将之前append进的子元素都清空:
需删除元素和内容,一般可使用以下两个 jQuery 方法:
1、remove() 方法删除被选元素及其子元素。
2、empty() 方法删除被选元素的子元素。
如果还有疑问,可以继续提问。如果解答了同学的疑问,望采纳~
祝学习愉快~
相似问题
回答 2
回答 1
回答 2
回答 1
回答 1