AJAX即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。
AJAX = 异步 JavaScript和XML（标准通用标记语言的子集）。
AJAX 是一种用于创建快速动态网页的技术。
AJAX 不是新的编程语言，而是一种使用现有标准的新方法。
通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
传统的网页（不使用 AJAX）如果需要更新内容，必须重载整个网页页面。
 
使用ajax实现传输对象、集合、数组等（xml）
Jquery包中封装了ajax相关的
package com.maya.ajax;

import java.io.IOException;

import java.util.ArrayList;

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.maya.user.Users;

/**

 * Servlet implementation class TestAjax2

 */

@WebServlet("/testajax2")

public class TestAjax2 extends HttpServlet {

    private static final long serialVersionUID = 1L;

    /**

     * @see HttpServlet#HttpServlet()

     */

    public TestAjax2() {

        super();

        // TODO Auto-generated constructor stub

    }

    /**

     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)

     */

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        request.setCharacterEncoding("utf-8");

        response.setCharacterEncoding("utf-8");

          Users user=new Users();

          user.setName("张三");

          user.setSex("男");

          user.setAge(23);

          Users user1=new Users();

          user1.setName("李四");

          user1.setSex("女");

          user1.setAge(24);

          Users user2=new Users();

          user2.setName("王五");

          user2.setSex("男");

          user2.setAge(25);

          ArrayList<Users> list=new ArrayList<Users>();

          list.add(user);

          list.add(user1);

          list.add(user2);        

        response.getWriter().append("<?xml version='1.0' ?>");

        response.getWriter().append("<users>");

        for(Users u:list){

            response.getWriter().append("<user>");

            response.getWriter().append("<name>"+u.getName()+"</name>");

            response.getWriter().append("<sex>"+u.getSex()+"</sex>");

            response.getWriter().append("<age>"+u.getAge()+"</age>");

            response.getWriter().append("</user>");

        }

        response.getWriter().append("</users>");

    }

    /**

     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)

     */

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        // TODO Auto-generated method stub

        doGet(request, response);

    }

}

HTML页面：

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<script type="text/javascript" src="jquery-1.11.1.min.js"></script>

<script type="text/javascript">

$(document).ready(function(){

    $("#ss").click(function(){

        $.ajax({

            url:"testajax2",

            data:{},

            type:"POST",

            dataType:"XML",

            success:function(httpdata){

                var s=$(httpdata).find("user");

                for(var i=0;i<s.length;i++){

                    $("#shuchu").append(s.eq(i).find("name").text());

                    $("#shuchu").append("&nbsp;");

                    $("#shuchu").append(s.eq(i).find("sex").text());

                    $("#shuchu").append("&nbsp;");

                    $("#shuchu").append(s.eq(i).find("age").text());

                    $("#shuchu").append("<br>");

                }

            }

        });

    });

});

</script>

</head>

<body>

<span id="ss">点击获取数据</span>

<div id="shuchu"></div>

</body>

</html>
 
 

ajax（异步页面动态刷新）的更多相关文章

  1. 火狐浏览器调试ajax异步页面时报错NS_ERROR_UNEXPECTER

    第一个直观的结论就是ajax调用出错,如果其他浏览器却调用没报错,而且正常返回值了,那么就是Firefox浏览器的问题了: 如果其他浏览器也没余完全正常执行,而是出现和我上一篇ajax向后台请求数据, ...

  2. 淘宝购物车页面 智能搜索框Ajax异步加载数据

    如果有朋友对本篇文章的一些知识点不了解的话,可以先阅读此篇文章.在这篇文章中,我大概介绍了一下构建淘宝购物车页面需要的基础知识. 这篇文章主要探讨的是智能搜索框Ajax异步加载数据.jQuery的社区 ...

  3. Ajax异步打开新页面弹框被拦截，无法将参数值传递到后台

    一.Form提交,打开新页面被拦截 手动触发Form提交打开新页面是不会被拦截的,但是如果通过Ajax异步处理回调后再程序自动触发Form提交的话,就会被浏览器当成广告弹框拦截 1.暂时的解决办法:如 ...

  4. 【坑】前端使用ajax异步请求以后，springMvc拦截器跳转页面无效

    文章目录 前言 `$.ajaxSetup( )` 后记 前言 本文着重解决前后端分离开发的页面调整问题. 笔者,在做一个需求,需要对访问网站,但是没有登录的用户进行拦截,将他们重定向到首页. 很简单的 ...

  5. ajax异步请求

    做前端开发的朋友对于ajax异步更新一定印象深刻,作为刚入坑的小白,今天就和大家一起聊聊关于ajax异步请求的那点事.既然是ajax就少不了jQuery的知识,推荐大家访问www.w3school.c ...

  6. SSH实战 · AJAX异步校验

    前台JS代码 /*异步验证用户名的输入格式以及是否存在*/ function CheckUsername(){      /*取到用户名输入框*/      var nametxt = documen ...

  7. spring HandlerInterceptorAdapter拦截ajax异步请求，报错ERR_INCOMPLETE_CHUNKED_ENCODING

    话不多说,直接上正文. 异常信息: Failed to load resource: net::ERR_INCOMPLETE_CHUNKED_ENCODING 问题描述: 该异常是在页面发送ajax请 ...

  8. ASP.NET MVC 网站开发总结（五）——Ajax异步提交表单之检查验证码

    首先提出一个问题:在做网站开发的时候,用到了验证码来防止恶意提交表单,那么要如何实现当验证码错误时,只是刷新一下验证码,而其它填写的信息不改变? 先说一下为什么有这个需求:以提交注册信息页面为例,一般 ...

  9. ajax异步请求Response.Redirect重定向

    一个ajax异步请求报错->捕获异常->重定向错误提示页面.  一个简单的流程 结果一直搞不定.重定向无效.各种百度之. 后来突然想起 ajax的请求是不能在后台重定向的. 如果硬要重定向 ...

随机推荐

  1. atom常用插件安装

    安装插件方法: File -Settings -Install 在搜索框里搜索你想要的插件,出来之后 点击install ,下图以 linter-selint 为例 ATOM常用插件推荐 simpli ...

  2. php闭包简单实例

    <?php function getClosure($i) { $i = $i.'-'.date('H:i:s'); return function ($param) use ($i) { ec ...

  3. PHP fsockopen模拟POST/GET方法

    原文链接:http://www.nowamagic.net/academy/detail/12220214 fsockopen 除了前面小节的模拟生成 HTTP 连接之外,还能实现很多功能,比如模拟  ...

  4. java 中 集合类相关问题

    1,Java中Collection和Collections的差别 java.util.Collection 是一个集合接口.它提供了对集合对象进行基本操作的通用接口方法. Collection接口在J ...

  5. Myecplise Tomcat 启动很慢

    今天突然遇到一个问题,tomcat在Myecplse启动非常慢,直接用tomcat自带的start.bat启动很快,如果通过Myeclipse启动会发现项目一直在实例化,最后发现是因为加了断点调试,断 ...

  6. [note]可持久化Trie

    可持久化Trie 参考可持久化线段树的思想,修改的时候先直接复制,再对需要修改的点新建节点 可持久化Trie也是同样的做法,假设现在需要在原本Trie的基础上插入一个字符串 先把上个Trie的对应节点 ...

  7. ros下单目相机校正

    1. 安装对应的驱动与程序包. 图像对应包   http://wiki.ros.org/camera_calibration          在gitbub下载image_pipeline :    ...

  8. Django用ajax发送post请求时csrf拦截的解决方案

    把下面的代码写在模版文件中就可以了, 注:不是js文件,是模版文件加载的执行的,所有写js里没效果 $.ajaxSetup({ data: {csrfmiddlewaretoken: '{{ csrf ...

  9. Python 中奇妙的下划线

    单个下划线(_) 通常有三种用法: 在python解释器: 单个下划线代表上次在交互解释期对话中(控制台)执行的结果.这种情况在标准的CPython解释器中首次被实现,接下来这种习惯也被保持下来: & ...

  10. Android Interactive Animation

    Ref:收集android上开源的酷炫的交互动画和视觉效果:Interactive-animation Ref:界面特效 Ref:BaseAnimation是基于开源的APP,致力于收集各种动画效果( ...