<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta charset="UTF-8">

    <title>title</title>

</head>

<body>

</body>

</html>

<script>

  /*

    封装的过程

      重复的代码写出来

      不能固定的 作为 参数

    ajax工具函数

      回调函数的作用

  */

  // get请求

  // 因为是我们封装的函数 约定

  // data的格式是 key1=value1&key2=value2

  function get(url,data,success){

    // 创建异步对象

    var xhr = new XMLHttpRequest();

    // 请求行

    if(data){

      url+='?';

      url+=data;

    }

    xhr.open('get',url);

    // 请求头(get可以省略)

    // 回调函数

    xhr.onreadystatechange = function(){

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

        // 调用 传入的 回调函数

        success(xhr.responseText);

        // 普通字符串

        console.log(xhr.responseText);

        // JSON

        console.log(JSON.parse(xhr.responseText));

        // XML

        console.log(xhr.responseXML);

        // 这里用return 获取不到数据的

        // return xhr.responseText;

      }

    }

    // 请求主体 发送

    xhr.send(null);

  }

  // post请求

  function post(url,data,success){

    // 创建异步对象

    var xhr = new XMLHttpRequest();

    // 请求行

    xhr.open('post',url);

    // 请求头

    // 有数据 才要设置

    if(data){

      xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');

    }

    // 回调函数

    xhr.onreadystatechange = function(){

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

        console.log(xhr.responseText);

        success(xhr.responseText);

      }

    }

    // 请求主体 发送

    xhr.send(data);

  }

</script>

ajax_封装函数_步骤1的更多相关文章

  1. ajax_封装函数_升级_传递多个参数和传递一个参数

    HTML: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset=" ...

  2. day16_函数作用域_匿名函数_函数式编程_map_reduce_filter_（部分）内置函数

    20180729    补充部分代码 20180727    上传代码 #!/usr/bin/env python # -*- coding:utf-8 -*- # ***************** ...

  3. Javascript:来一个AJAX封装函数

    前不久换工作了,最近一直在出差,忙得跟狗一样,所以博客都荒废许久了. 最近的工作中涉及到大量的ajax操作,本来该后台做的事也要我来做了.而现在使用的ajax函数是一个后台人员封装的—-但他又是基于 ...

  4. eclipse快速移动项目到另一台机器_步骤

    ​快速移动项目到另一台机器_步骤 1.设置好eclipse的编码,必须对应个人项目文件的编码{ window--preferences--general--workspace-text file en ...

  5. jQuery封装函数

    //1,插件命名:jQuery.插件名.js 为拉避免和其他库的冲突// //2,自定义插件尽量避免使用$ 如果非要使用$就一定要将jQuery传递进去,//写在最后加一个小括号写jquery ;结束 ...

  6. Eclipse中通过Android模拟器调用OpenGL ES2.0函数操作步骤

    原文地址: Eclipse中通过Android模拟器调用OpenGL ES2.0函数操作步骤 - 网络资源是无限的 - 博客频道 - CSDN.NET http://blog.csdn.net/fen ...

  7. 浏览器兼容——DOM事件封装函数

    //封装函数var eventUtil={    //添加事件    addHandler:function(element,type,handler){        if(element.addE ...

  8. WMI 获取硬件信息的封装函数与获取联想台式机的出厂编号方法

    原文:WMI 获取硬件信息的封装函数与获取联想台式机的出厂编号方法 今天玩了一把WMI,查询了一下电脑的硬件信息,感觉很多代码都是可以提取出来的,就自己把那些公共部分提出出来,以后如果要获取 某部分的 ...

  9. Ajax封装函数笔记

    Ajax封装函数: function ajax(method, url, data, success) { //打开浏览器 //1.创建一个ajax对象 var xhr = null; try { x ...

随机推荐

  1. .OnCommand mfc

    .OnCommand是响应WM_COMMAND消息的,一般是响应控件和菜单的命令消息时使用. 如果 WM_COMMAND 来自控件的话 lParam 就是发送这个 WM_COMMAND 消息的控件的句 ...

  2. bzoj2325 [ZJOI2011]道馆之战 树链剖分+DP+类线段树最大字段和

    题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=2325 题解 可以参考线段树动态维护最大子段和的做法. 对于线段树上每个节点 \(o\),维护 ...

  3. [BZOJ] 书堆

    问题描述 蚂蚁是勤劳的动物,他们喜欢挑战极限?现在他们迎来了一个难题!蚂蚁居住在图书馆里,图书馆里有大量的书籍.书是形状大小质量都一样的矩形.蚂蚁要把这些书摆在水平桌子的边緣.蚂蚁喜欢整洁的布置,所以 ...

  4. NOIP2015 提高组 Day T3 斗地主

    题目描述 牛牛最近迷上了一种叫斗地主的扑克游戏.斗地主是一种使用黑桃.红心.梅花.方片的A到K加上大小王的共5张牌来进行的扑克牌游戏.在斗地主中,牌的大小关 系根据牌的数码表示如下:3<4< ...

  5. Dubbo学习-8-dubbo启动时检查

    启动时检查的作用如下: (1)Dubbo 缺省会在启动时检查依赖的服务是否可用,不可用时会抛出异常,阻止 Spring 初始化完成,以便上线时,能及早发现问题,默认 check="true& ...

  6. ht-5 treemap特性

    (1)TreeMap类通过使用红黑树实现Map接口 (2)TreeMap提供按排序顺序存储键值对的有效手段,同时允许快速检索 (3)不同于散列映射,树映射保证它的元素按键的自然顺序升序排列 (4)Tr ...

  7. 批处理bat文件显示中文乱码解决方式

    1.下载Notepad++并安装 2.选择编码,将文件编码转换为ANSI编码

  8. 【CF1257F】Make Them Similar【meet in the middle+hash】

    题意:给定n个数,让你给出一个数,使得n个数与给出的数异或后得到的数的二进制表示中1的数量相同 题解:考虑暴搜2^30去找答案,显然不可接受 显然可以发现,这是一个经典的meet in the mid ...

  9. Python_014(面向对象之继承)

    一.面向对象之继承 1.初始继承 引入:面向对象的三大特性:继承,多态,封装 a.继承是创建新类的一种方式,在python中,新建的类可以继承一个或多个父类,父类又可称为基类或超类;新建的类称为派生类 ...

  10. jquery easyui控件事件监听委托给jquery事件监听，keyup取最新值问题

    <div id="<?php echo NS; ?>toolbar"> <div style="padding:5px"> ...