AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。
AJAX = 异步 JavaScriptXML标准通用标记语言的子集)。
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. laravel学习之路4artisan

    php artisan list php artisan help migrate Tinker 让你可以在命令行中与 Laravel 应用进行交互php artisan tinker 在routes ...

  2. iOS中获取系统相册中的图片

    一.获取单张图片 思路: 1.利用UIImagePickerController可以从系统自带的App(照片\相机)中获得图片 2.设置代理,遵守代理协议 注意这个UIImagePickerContr ...

  3. APNS的推送机制 3

    APNS的推送机制 首先我们看一下苹果官方给出的对iOS推送机制的解释.如下图 Provider就是我们自己程序的后台服务器,APNS是Apple Push Notification Service的 ...

  4. spring+struts1

    概括及介绍: 集成原理:在Action 中获得BeanFactory,通过BeanFactory取得业务逻辑对象 本例采用:JDK1.8,tomcat7.0.9  技术点:spring与strut1集 ...

  5. nginx学习之静态内容篇(五)

    1.根目录和索引文件 server { root /www/data; location / { } location /images/ { } location ~ \.(mp3|mp4) { ro ...

  6. java 分布式锁 -图解- 秒懂

    目录 写在前面 1.1. 分布式锁 简介 1.1.1. 图解:公平锁和可重入锁 模型 1.1.2. 图解: zookeeper分布式锁的原理 1.1.3. 分布式锁的基本流程 1.1.4. 加锁的实现 ...

  7. Unable to determine IP address from host name

  8. MySQL合并多行

    select id,group_concat(re_id order by re_id separator ",") as re_idfrom tablenamegroup by ...

  9. JavaScript 中 onload 事件绑定多个方法的优化建议

    页面加载完毕时会触发 onload 事件.基于内容(HTML)要与行为(JavaScript)分离的编码思想,我们需要将一些对页面的初始化操作写在方法内,并通过window.onload = func ...

  10. Django 之restframework1

    Restframework 这里先简单的介绍一下restful协议 ----一切皆是资源,操作只是请求方式 基于restful协议的框架有很多Django下的restframework只是其中的一种 ...