<script type="text/javascript">

    // Ajax固定的模版

    // 第一步:创建xhr对象,使用new关键字来调用内置的构造函数

    var xhr = new XMLHttpRequest();

    // 第二步:指定接收回来的内容。监听xhr

    // 对象的onreadystatechange事件,这个事件xhr对象的"就绪状态"改变的时候触发。我们只关心就绪状态为4的时候的事情;

    xhr.onreadystatechange = function(){

        if( xhr.readyState == 4 ){

            // 接收完文件要做的事情,让txt文本中的内容读取出来

            document.getElementById("info").innerHTML = xhr.responseText;

        }

    };

    // 第三步,创建哪一个请求,第一个参数请求是类型是get或post,第二个参数是请求的路径,第三个参数:是否是异步的机制;一定是true;

    xhr.open("get","test.txt",true);

    // 第四步:发送请求,圆括号内是请求的内容,get请求没有报文体写null;

    xhr.send(null);

</script>

原生的Ajax的实现的更多相关文章

  1. 使用XMLHttpRequest对象完成原生的AJAX请求

    1.大家眼中的Ajax 说到Ajax,只要有过前端开发经验的童鞋一定都不陌生,大都知道它就是一种与后端之间的通信技术,通过这个神奇的家伙,我们不用像传统表单那样填完信息一点提交就呼啦呼啦跳转了.Aja ...

  2. 原生js ajax与jquery ajax的区别

    原生js ajax的调用: ajax({ type : "get", url : "02_ajax_get.txt", data : { "userN ...

  3. js原生的Ajax

    js原生的Ajax其实就是围绕浏览器内内置的Ajax引擎对象进行学习的,要使用js原 生的Ajax完成异步操作,有如下几个步骤: 1)创建Ajax引擎对象 2)为Ajax引擎对象绑定监听(监听服务器已 ...

  4. 原生javascript Ajax

    代码 1. IE5 ,IE6 使用ActiveXObject对象,   其余现代浏览器都支持XMLHttpRequest对象: function ajaxObject(){ var xmlhttp; ...

  5. 原生的AJAX写法,可以直接复制过来套用

    方法一: function createXMLHTTPRequest() { //1.创建XMLHttpRequest对象 //这是XMLHttpReuquest对象无部使用中最复杂的一步 //需要针 ...

  6. Ajax_简介: 异步的 JS 和 XML_原生写 ajax 分析其原理_jquery_ajax_art-template

    AJAX Asynchronous JavaScript And XML 通过 AJAX 可以在 浏览器中向 服务器 发送异步请求 一种 使用现有标准的 新方法,而非新语言 XML  可扩展标记语言 ...

  7. 原生javascript AJAX 三级联动

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. JavaScript原生封装ajax请求和Jquery中的ajax请求

    前言:ajax的神奇之处在于JavaScript 可在不重载页面的情况与 Web 服务器交换数据,即在不需要刷新页面的情况下,就可以产生局部刷新的效果.Ajax 在浏览器与 Web 服务器之间使用异步 ...

  9. 原生实现ajax解析--XMLHttpRequest

    ajax基础: Asynchronous JavaScript and XML,意思就是用JavaScript执行异步网络请求. 如果仔细观察一个Form的提交,你就会发现,一旦用户点击“Submit ...

  10. 原生的ajax请求

    原生ajax请求的步骤: get 请求: 1,创建一个xhr变量 var xhr=new XMhttpRequest(); 2,设置请求方式和请求地址 xhr.open('url','http//19 ...

随机推荐

  1. java虚拟机学习-深入理解JVM(1)

    1   Java技术与Java虚拟机 说起Java,人们首先想到的是Java编程语言,然而事实上,Java是一种技术,它由四方面组成: Java编程语言.Java类文件格式.Java虚拟机和Java应 ...

  2. zookeeper3.4.9 centos6.5 集群安装

    安装jdk http://www.cnblogs.com/xiaojf/p/6568426.html [root@m1 jar]# .tar.gz -C ../ [root@m1 jar]# cd . ...

  3. String为值类型还是引用类型

    关于String为值类型还是引用类型的讨论一直没有平息,最近一直在研究性能方面的问题,今天再次将此问题进行一次明确.希望能给大家带来点帮助. 如果有错误请指出. 来看下面例子: //值类型 int a ...

  4. MarkDown编辑器快捷方式

    常用快捷: Ctrl+K 插入代码块 Ctrl+G 插入图片 Ctrl+B 文字加粗 Ctrl+I 文字倾斜 Ctrl+G 插入图片 Tab 默认新建高亮代码块 ">" 向右 ...

  5. Java IO流之缓冲流

    一.缓冲流简介 二.BufferedInputStream 三.其他三种缓冲流

  6. Eclipse之JSON导包

    1.选中要导包的工程-–>2.右击选择创建文件夹--->3.将要导的包复制到该文件夹下--–>4.右击要导入的包-->5.选择Build path->Add to Bui ...

  7. css 中的背景图片小技巧和存在的坑

    body 的背景图设置 第一种 :这种情况下背景图片可以缩放 但是不能完全等比缩放 background: url(imgs/1.jpg)no-repeat; background-position: ...

  8. 对 dotweb 框架进行统一的自定义错误处理

    助移动端的增长,如今 RESTful 风格的 API 已经十分流行, 用各种语言去写后端 API 都有很成熟方便的方案,用 golang 写后端 API 更是生产力的代表, 你可以用不输 python ...

  9. php注册登录源代码

    php注册登录源代码 链接数据库<?php$conn=mysql_connect('localhost','root','');mysql_select_db('ht',$conn);mysql ...

  10. MyEclipse解决SVN同步冲突问题conflict in the working copy obstructs the current operation

    服务端版本控制软件subversion,客户端是eclipse的插件subclipse.当删除一个东西的时候老是提示错误,说冲突 commit -m "" C:/Users/Adm ...