27AJAX的学习

雨点打透心脏的1/2处 2021-10-23 23:50 130阅读 0赞

\#1

1.  ajax第一个例子、xml方式传递数据  
    ajax.html&AjaxServlet  
    // 1. 创建XMLHttpRequest对象 为了兼容浏览器，这里需要自己创建一个工厂方法  
    var xhr = new XMLHttpRequest(); // 此版本暂时没有考虑兼容浏览器的问题  
    // 2. xhr对象的open方法访问对应的servlet或者文件  
    xhr.open(“GET”, “ajaxServlet”, true); // todo  
    // 3. 检测xhr对象状态，在合适的时候进行处理  
    xhr.onreadystatechange = function () \{  
    if (xhr.readyState == 4 && xhr.status == 200) \{  
    document.getElementById(“data”).innerHTML = xhr.responseText; // 获取字符串的方式  
    \}  
    \};  
    // 4. 发送请求  
    xhr.send(); // get请求不需要增加参数
    
    // 兼容ie低版本浏览器  
    function createXMLHttpRequest() \{  
    if (window.XMLHttpRequest) \{  
    return new XMLHttpRequest();  
    \} else if (window.ActiveXObject) \{  
    return new ActiveXObject(“Microsoft.XMLHTTP”);  
    \} else \{  
    return null;  
    \}  
    \}
2.  下拉菜单切换， 使用ajax交互数据  
    userXml.html

UserServlet  
@Override  
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException \{  
System.out.println(“userServlet coming”);  
// 1. 由于返回的是xml，需要为response设置contentType  
resp.setContentType(“text/xml;charset=utf-8”);  
// 2. 获取writer  
Writer writer = resp.getWriter();  
// 3. 获取map中的key  
int mapKey = Integer.parseInt(req.getParameter(“mapKey”));  
// 4. 获取用户对象列表  
List list = map.get(mapKey);  
// 5. 拼接xml  
StringBuffer stringBuffer = new StringBuffer();  
stringBuffer.append("");  
for (User user : list) \{  
stringBuffer.append("");  
stringBuffer.append("").append(user.getId()).append("");  
stringBuffer.append("").append(user.getName()).append("");  
stringBuffer.append("").append(user.getPassword()).append("");  
stringBuffer.append("");  
\}  
stringBuffer.append("");

// 6. 通过writer写回去
        writer.write(stringBuffer.toString());
    }

\#2

1.  post方式的ajax请求  
    xhr.open(“POST”, “userPostServlet”, true);  
    xhr.setRequestHeader(“Content-type”, “application/x-www-form-urlencoded”);  
    xhr.send(“mapKey=” + mapKey);
2.  xstream  
    XStreamTest  
    public class XStreamTest \{  
    @Test  
    public void beanToXml() \{  
    User user = new User(1, “小智”, “xiaozhi”);  
    // 创建xstream对象  
    XStream xStream = new XStream();  
    // 设置别名，默认会输出全路径  
    xStream.alias(“user”, User.class);  
    String xml = xStream.toXML(user);  
    System.out.println(xml);  
    \}
    
    @Test  
    public void xmlToBean() \{  
    String xml = “\\n” +  
    " 1\\n" +  
    " 小智\\n" +  
    " xiaozhi\\n" +  
    “”;  
    XStream xStream = new XStream();  
    xStream.alias(“user”, User.class);  
    User user = (User) xStream.fromXML(xml);  
    System.out.println(user);  
    \}
    
    @Test  
    public void annotation() \{  
    User1 user = new User1(2, “小峰”, “xiaofeng”);  
    XStream xStream = new XStream();  
    // 声明XStream注解来源  
    xStream.processAnnotations(User1.class);  
    String xml = xStream.toXML(user);  
    System.out.println(xml);  
    \}  
    \}  
    User1  
    @XStreamAlias(“liergou”)  
    public class User1 \{  
    @XStreamAlias(“xxx”)  
    private int id;  
    @XStreamAlias(“username”)  
    private String name;  
    @XStreamAlias(“mima”)  
    private String password;  
    3.json Servlet部分修改