<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <meta charset="utf-8" />

</head>

<body>

    <input type="text" id="txt1" value="1212" />

    <script>

        var obj = document.getElementById('txt1');

        console.log(obj.value);

        var xmlHttp;

        if (window.XMLHttpRequest) {

            xmlHttp = new XMLHttpRequest();

        } else {

            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

        }

        xmlHttp.onreadystatechange = function () {

            if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {

                console.log(1);

                obj.value = xmlHttp.responseText;

            }

        };

        xmlHttp.open('get', 'json1.json', true);   // true 异步 false 同步        url:   aaa.asp?a=1&b=2

        xmlHttp.send();   //send('11111'). 当post的时候提交 '11111'

        console.log(2);

        //xmlhttp.open("POST", "ajax_test.asp", true);

        //xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

        //xmlhttp.send("fname=Bill&lname=Gates");

        //当为true，打出顺序为  2  1

        //当为false，打出顺序为 1  2

    </script>

</body>

</html>

教程地址：http://www.w3school.com.cn/ajax/index.asp

js 原生ajax实现的更多相关文章

  1. JS原生ajax

    原文链接:http://caibaojian.com/ajax-jsonp.html 一.JS原生ajax ajax:一种请求数据的方式,不需要刷新整个页面: ajax的技术核心是 XMLHttpRe ...

  2. JS原生ajax与Jquery插件ajax深入学习

    序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...

  3. js原生Ajax的封装与使用

    一.原生Ajax代码的封装如下: (function() { var XHR = { createStandardXHR: function() { return new XMLHttpRequest ...

  4. js原生Ajax 的封装和原理

    原理及概念 AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是一种用于创建快速动态网页的技术. 动态网页:是指可以通过服务器语言结合数 ...

  5. JS原生Ajax&Jquery的Ajax技术&Json

    1.介绍Ajax Ajax = 异步 JavaScript 和 XML Ajax是一种创建快速动态网页的技术 通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新.这意味着可以不用整个 ...

  6. js原生Ajax(十四)

    一.XMLHttpRequest    [使用XMLHttpRequest时,必须将html部署到web服务器中]1) 指定请求1.实例化eg: var http = new XMLHttpReque ...

  7. Jquery学习笔记 --ajax删除用户，使用了js原生ajax

    主要复习了php的pdo数据库操作,和js的ajax,真麻烦,希望jquery的ajax简单点. index.php: 1 <!DOCTYPE html> 2 <html lang= ...

  8. [代码]JS原生Ajax,GET和POST

    javascript/js的ajax的GET请求: <script type="text/javascript"> /* 创建 XMLHttpRequest 对象 */ ...

  9. Jquery学习笔记（10）--ajax删除用户，使用了js原生ajax

    主要复习了php的pdo数据库操作,和js的ajax,真麻烦,希望jquery的ajax简单点. index.php: <!DOCTYPE html> <html lang=&quo ...

  10. js 原生 ajax

    //js ajax function Ajax(url,type,data,comFun,sucFun,errFun) { //1.创建XMLHttpRequest对象 var xmlHttpRequ ...

随机推荐

  1. AWS专线服务总结和疑问

    1.AWS专线服务的入口, 从介绍页上可以看到,有如下功能: (1)专线可以连接AWS云主机和传统的数据中心或者分支机构. (2)专线可以连接AWS云主机和托管区的主机. 连接要素: (1)需要使用V ...

  2. Future FutrueTask Callable类源码说明以及原理使用

    1.Future Callable FutureTask 源码说明 JDK内置的Future主要使用到了Callable接口和FutureTask类. Callable是类似于Runnable的接口, ...

  3. leetcode-67.二进制求和

    leetcode-67.二进制求和 Points 数组 数学 题意 给定两个二进制字符串,返回他们的和(用二进制表示). 输入为非空字符串且只包含数字 1 和 0. 示例 1: 输入: a = &qu ...

  4. 简单 PHP + MySQL 数据库动态网站制作 -- 摘抄

    在这篇文章中,我尽量用最浅显易懂的语言来说明使用 PHP, MySQL 制作一个动态网站的基本技术.阅读本文需要简单的 HTML 基础知识和(任一编程语言的)编程基础知识(例如变量.值.循环.语句块的 ...

  5. getprop从哪获取属性

    Android SystemProperties设置/取得系统属性的用法总结 通过调查得知,Android系统中取得/设置系统属性的用法参考以下3篇文章就足够了. 1.Android SystemPr ...

  6. asp.net Web项目中使用Log4Net进行错误日志记录

      使用log4net可以很方便地为应用添加日志功能.应用Log4net,开发者可以很精确地控制日志信息的输出,减少了多余信息,提高了日志记录性能.同时,通过外部配置文件,用户可以不用重新编译程序就能 ...

  7. Echarts在手机端y轴数据过大，显示不全

    解决办法: 减少y轴的margion,和格式化y轴 myChart.setOption({ ..., yAxis: { axisLabel: { margin: , formatter: functi ...

  8. c/c++ 类模板初探

    类模板 1,模板类里的函数都是模板函数 2,模板类里的函数,在类外面实现的时候,要用模板函数(方法:push_back)的方式实现,在类内部实现时,不需要用模板函数(方法:show)方式实现. 3,用 ...

  9. windows下数据库文件使用脚本同步到linux下的mysql数据库中

    1.背景 windows server 2008 下 每天会有 *.sql数据文件 需要上传到linux 中的mysql数据库中 而运维人员是在 windows server 下使用 xshell 连 ...

  10. background-image使用svg如何改变颜色

    结论 在我多番测试之后,才发现background-image使用svg,改变颜色根本做不了. 分析 当svg图片被使用成background-image,颜色的设置需要在svg内部才能生效.在外部C ...