浏览器创建ajax请求:

1、如果是Firefox、Opera、Safari等高级浏览器,可使用XMLHttpRequest()方式创建一个新的ajax请求对象。

如果是IE浏览器,则使用ActiveXObject('Microsoft.XMLHTTP')方式创建,具体代码如下所示:

 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ajax练习</title>
</head>
<body>
<script>
function doAjax (the_request) {
var request = null;
// 判断浏览器支持的请求方式
alert("点击");
if(window.XMLHttpRequest){
request = new XMLHttpRequest();
if(request){
request.open('GET',the_request,true);
request.onreadystatechange = function(){
if(request.readyState==4){
if(request.status==200){
alert(request.responseText);
document.getElementById("view").innerHTML = request.responseText;
}
}
}
request.send(null);
}else{
alert("error");
} }else if(window.ActiveXObject){
request = new ActiveXObject('Microsoft.XMLHTTP');
request = new XMLHttpRequest();
if(request){
request.open('GET',the_request,true);
request.onreadystatechange = function(){
if(request.readyState==4){
if(request.status==200){
alert(request.responseText);
document.getElementById("view").innerHTML = request.responseText;
}
}
}
request.send(null);
}else{
alert("error");
}
}else{
alert("你的浏览器不支持ajax!");
}
}
</script>
<button onclick="javascript: doAjax('aa.txt')">请求</button>
<div id="view">
doAjax
</div>
</body>
</html>

另一种写法;

 <html>
<head>
<title>Ajax初步入门视频课程</title>
</head> <body> <script type="text/javascript"> var xmlHttp = null; function readyStateChangeHandle()
{
if (xmlHttp.readyState ==4 ) {
if (xmlHttp.status == 200 ) {
document.getElementById('vv').innerHTML = xmlHttp.responseText;
}
}
} function ajaxFunction(the_request_url)
{
try {
xmlHttp = new XMLHttpRequest() ;
}
catch(e) {
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e) {
alert("您的浏览器不支持ajax") ;
return false;
}
}
} if (xmlHttp) {
xmlHttp.open('GET', the_request_url, true);
xmlHttp.onreadystatechange = readyStateChangeHandle;
xmlHttp.send(null);
} else {
alert('error');
}
} </script>
<input type="button" id="test" value="test" onclick="javascript:ajaxFunction('ajax-04.txt')" />
<br/><br/>
<div style="border:1px solid black;width:300px;height:250px;" id="vv">test ajax</div> </body> </html>

Ajax基础(一)--创建请求的更多相关文章

  1. 【JavaWeb】Ajax基础

    Ajax介绍 Asynchronous JavaScript And XML(异步的JavaScript和XML): Ajax可以在不刷新页面的前提下,进行页面局部更新: Ajax不是新的技术,Aja ...

  2. 史上最全的Ajax基础详解

    同步请求和异步请求 先解释一下同步和异步的概念: 同步是指:发送方发出数据后,等接收方发回响应以后才发下一个数据包的通讯方式. 异步是指:发送方发出数据后,不等接收方发回响应,接着发送下个数据包的通讯 ...

  3. 【Java EE 学习 31】【JavaScript基础增强】【Ajax基础】【Json基础】

    一.JavaScript基础增强 1.弹窗 (1)使用window对象的showModelDialog方法和showModelessDialog方法分别可以弹出模式窗口和非模式窗口,但是只能在IE中使 ...

  4. Ajax基础知识《一》

    对于网站开发人员,一定不会陌生的Ajax技术,本篇就让我们认识一下它,或许在日后的开发过程中我们就可以使用到.Ajax在那方面使用的比较多呢?答案:表单注册,传统的表单注册,有时需要填写大量的信息,当 ...

  5. Ajax基础2

    什么是服务器 网页浏览过程的分析 如何配置自己的服务器程序(AMP) 什么是Ajax 无刷新数据读取 异步,同步 Ajax基础(2) 使用Ajax 基础请求显示txt的文件 字符集编码 缓存,阻止缓存 ...

  6. Ajax基础--JavaScript实现

    ajax原理 1.ajax 即“Asynchronous JavaScript and XML”(异步 JavaScript 和 XML),也就是无刷新数据读取. 通俗地讲就是:AJAX 通过在后台与 ...

  7. Ajax基础知识(二)

    接上一篇  Ajax基础知识(一) 在上一篇博客里,抛弃了VS中新建aspx页面,拖个button写上C#代码的方式.使用ajax的方式,异步向服务器请求数据.我们让服务器只简单的返回一个" ...

  8. 原生AJAX基础讲解及兼容处理

    原文:原生AJAX基础讲解及兼容处理 AJAX = Asynchronous JavaScript and XML (异步的JavaScript和XML). AJAX不是新技术 ,但却是热门的技术.它 ...

  9. 原生 JS Ajax,GET和POST 请求实例代码

    javascript/js的ajax的GET请求代码如下所示: <script type="text/javascript"> /* 创建 XMLHttpRequest ...

  10. AJAX基础_AJAX获取PHP数据

    前言 本篇AJAX基础教程,只讲干货,拒绝废话. 全文通过两个实例来讲解AJAX的基本用法,第1个实例是使用AJAX技术从服务器获取纯文本(HTML)数据, 第2个实例是获取从服务器PHP文件的数据. ...

随机推荐

  1. python pip源配置,pip配置文件存放位置

    https://blog.csdn.net/u013066730/article/details/54580789/ pip源配置文件可以放置的位置: Linux/Unix: /etc/pip.con ...

  2. sql中in和exists的区别

    in 和exists in是把外表和内表作hash 连接,而exists 是对外表作loop 循环,每次loop 循环再对内表进行查询. 一直以来认为exists 比in 效率高的说法是不准确的.如果 ...

  3. django博客项目5:博客首页视图(2)

    真正的 Django 博客首页视图 在此之前我们已经编写了 Blog 的首页视图,并且配置了 URL 和模板,让 Django 能够正确地处理 HTTP 请求并返回合适的 HTTP 响应.不过我们仅仅 ...

  4. linux虚拟机连不上网络

    1.修改文件ifcfg-ens33 # 切换目录 [root@localhost ~]# cd /etc/sysconfig/network-scripts/ # 将ONBOOT修改为yes [roo ...

  5. 【Java编程】写入、读取、遍历Properties文件

    在Java开发中通常我们会存储配置參数信息到属性文件.这种属性文件能够是拥有键值对的属性文件,也能够是XML文件.关于XML文件的操作,请參考博文[Java编程]DOM XML Parser 解析.遍 ...

  6. 关于 tf.nn.softmax_cross_entropy_with_logits 及 tf.clip_by_value

    In order to train our model, we need to define what it means for the model to be good. Well, actuall ...

  7. python 多进程使用Queue通信的例子

    import time from multiprocessing import Process,Queue MSG_QUEUE = Queue(5) def startA(msgQueue): whi ...

  8. Java泛型四:Java泛型总结

    原文地址https://www.cnblogs.com/lwbqqyumidi/p/3837629.html 一. 泛型概念的提出(为什么需要泛型)? 首先,我们看下下面这段简短的代码: 1 publ ...

  9. 『NiFi 学习之路』入门 —— 下载、安装与简单使用

    一.概述 "光说不练假把式." 官网上的介绍多少让人迷迷糊糊的,各种高大上的词语仿佛让 NiFi 离我们越来越远. 实践是最好的老师.那就让我们试用一下 NiFi 吧! 二.安装 ...

  10. Jconsle

    1. jconsole 远程连接: JConsole很好用,可以解决很多疑难杂症.但远程连接需要设置一下Java opt才可以使用.以下是步骤: 1). 在java opt下添加如下内容: 如果是无须 ...