AJAX入门

最新推荐文章于 2024-02-13 18:17:54 发布

baother0

最新推荐文章于 2024-02-13 18:17:54 发布

阅读量710

点赞数

分类专栏： javascript java web

本文链接：https://blog.csdn.net/xiao_niu_1/article/details/8833463

版权

java web 同时被 2 个专栏收录

19 篇文章 0 订阅

订阅专栏

javascript

17 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>ajax.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	<script type = "text/javascript">
		//Ajax中的一个重要对象时XMLHttpRequst.
		//声明一个空对象以接受XMLHttpRequest对象
		var xmlHttpRequest = null;
		function ajaxSubmit () {
			
			//alert (window.ActiveXObject);
			if (window.ActiveXObject) {//如果是IE浏览器
				xmlHttpRequest = new ActiveXObject ("Microsoft.XMLHTTP");//生成对象
			}else if(window.XMLHttpRequest) {//除IE外的其他浏览器实现
				xmlHttpRequest = new XMLHttpRequest ();
			}
			//alert (xmlHttpRequest);
			if (null != xmlHttpRequest) {
				//1：请求的方式2:请求的资源路径.
				xmlHttpRequest.open ("GET","AjaxServlet",true);//准备发送请求（但是没有真实发送请求）
				//关联好ajax的回调函数
				xmlHttpRequest.onreadystatechange = ajaxCallBack;
				//真正的向服务器发送数据
				xmlHttpRequest.send ();
			}
		}

		//回调函数
		function ajaxCallBack () {
			if (xmlHttpRequest.readyState == 4) {
				if (xmlHttpRequest.status == 200) {
					var responseText = xmlHttpRequest.responseText;
					document.getElementById ("content").innerHTML = responseText;
				}
			}
		}
	</script>
  </head>
  
  <body>
  	Ajax(Asynchronous Javascript and XML).异步的Javascript与XML
  	Ajax中的一个重要的对象时XMLHttpRequest
  	
	<input type = "button" value = "get content from servlet" onclick = "ajaxSubmit();"/>
	<div id = "content">
		
	</div>
  </body>
</html>
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>ajax.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	<script type = "text/javascript">
		//Ajax中的一个重要对象时XMLHttpRequst.
		//主要是微软ie6要处理兼容,6以后包括其他浏览器直接的new就可以
		//声明一个空对象以接受XMLHttpRequest对象
		var xmlHttpRequest = null;
		function ajaxSubmit () {
			
			//alert (window.ActiveXObject);
			if (window.ActiveXObject) {//如果是IE浏览器
				xmlHttpRequest = new ActiveXObject ("Microsoft.XMLHTTP");//生成对象
			}else if(window.XMLHttpRequest) {//除IE外的其他浏览器实现
				xmlHttpRequest = new XMLHttpRequest ();
			}
			//alert (xmlHttpRequest);
			if (null != xmlHttpRequest) {
				var v1 = document.getElementById ("value1");

				var v2 = document.getElementById ("value2");

				var param = v1.name+"="+v1.value+"&"+v2.name+"="+v2.value;
				//1：请求的方式2:请求的资源路径.
				//xmlHttpRequest.open ("GET","AjaxServlet"++"?"+param,true);//准备发送请求（但是没有真实发送请求）
				//post 用post提交的时候必须加上xmlHttpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
				xmlHttpRequest.open ("POST","AjaxServlet",true);
				xmlHttpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
				//关联好ajax的回调函数
				xmlHttpRequest.onreadystatechange = ajaxCallBack;
				//真正的向服务器发送数据
				//GET方式xmlHttpRequest.send (null);
				xmlHttpRequest.send (param);
			}
		}

		//回调函数
		function ajaxCallBack () {
			if (xmlHttpRequest.readyState == 4) {
				if (xmlHttpRequest.status == 200) {
					var responseText = xmlHttpRequest.responseText;
					document.getElementById ("content").innerHTML = document.getElementById ("content").innerHTML + responseText;
				}
			}
		}
	</script>
  </head>
  
  <body>
  	Ajax(Asynchronous Javascript and XML).异步的Javascript与XML
  	Ajax中的一个重要的对象时XMLHttpRequest
  	
	<input type = "button" value = "get content from servlet" onclick = "ajaxSubmit();"/>
	<input id = "value1" type = "text" name = "value1"/><input id = "value2" type = "text" name = "value2"/>
	<div id = "content">
		
	</div>
	
	<input type = "button" value = "hello"/>
	<a href = "www.baidu.com">fdf</a>
	<form enctype="application/x-www-form-urlencoded"></form>
  </body>
</html>

baother0

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
AJAX入门

ajax.html --> //Ajax中的一个重要对象时XMLHttpRequst. //声明一个空对象以接受XMLHttpRequest对象 var xmlHttpRequest = null; function ajaxSubmit () { //alert (window.ActiveXObject);
复制链接

扫一扫

专栏目录