js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用)

一、总结

2、匿名函数作为参数传递

二、js进阶ajax函数封装

ajax1.js

 function ajax(url,funSucc,fnFaild){ //1、以函数作为函数的参数传进来

var xhr=new XMLHttpRequest(); xhr.open('GET',url,true); xhr.send(null); xhr.onreadystatechange=function(){ if (xhr.readyState==4) { if (xhr.status==200) { funSucc(xhr.responseText) //2、使用传进来的函数
}else{
if (fnFaild){
fnFaild(xhr.statusText)
} }
}
} }

html测试代码

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax01</title>
<style type="text/css">
div{
background: green;
width: 300px;
height: 200px;
}
</style>
<script type="text/javascript" src="ajax1.js"></script> //1、引入js
</head>
<body>
<input type="button" id="btn" value="测试按钮">
<div id="div1"></div>
<script>
var btn=document.getElementById('btn');
var div1=document.getElementById('div1');
btn.onclick=function (){
ajax('test1.txt',function(str){ //2、匿名函数作为参数传过去
div1.innerHTML=str
},function(s){
alert(s)
})
}
</script>
</body>
</html>

js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用)的更多相关文章

  1. js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可)

    js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可) 一.总 ...

  2. js进阶ajax基本用法(创建对象,连接服务器,发送请求,获取服务器传过来的数据)

    js进阶ajax基本用法(创建对象,连接服务器,发送请求,获取服务器传过来的数据) 一.总结 1.ajax的浏览器的window对象的XMLHtmlRequest对象的两个重要方法:open(),se ...

  3. js进阶ajax读取json数据(ajax读取json和读取普通文本,和获取服务器返回数据(链接)都是一样的,在url处放上json文件的地址即可)

    js进阶ajax读取json数据(ajax读取json和读取普通文本,和获取服务器返回数据(链接)都是一样的,在url处放上json文件的地址即可) 一.总结 ajax读取json和读取普通文本,和获 ...

  4. 【 D3.js 进阶系列 】 进阶总结

    进阶系列的文章从去年10月开始写的,晃眼又是4个多月了,想在年前总结一下. 首先恭祝大家新年快乐.今年是羊年吧.前段时间和朋友聊天,聊到十二生肖里为什么没猫,我张口就道:不是因为十二生肖开会的时候猫迟 ...

  5. js进阶 14 jquery的ajax有哪些函数和事件(多练)

    js进阶 14 jquery的ajax有哪些函数和事件(多练) 一.总结 一句话总结:常用:load.ajax.post.get.getScript().getJSON().表单序列化,ajax事件这 ...

  6. js进阶 14-3 如何接收load函数从后台接收到的返回数据

    js进阶 14-3 如何接收load函数从后台接收到的返回数据 一.总结 一句话总结:load方法的回调函数的参数即可接收从后台的返回数据. 1.load方法的回调函数的参数是什么? 语法:load( ...

  7. 原生JS写Ajax的请求函数

    一.JS原生ajax ajax:一种请求数据的方式,不需要刷新整个页面:ajax的技术核心是 XMLHttpRequest 对象:ajax 请求过程:创建 XMLHttpRequest 对象.连接服务 ...

  8. ajax的回调函数和匿名函数

    1.什么是js回调函数 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为函数实际上 ...

  9. js数据类型的检测总结,附面试题--封装一个函数,输入任意,输出他的类型

    一.javascript 中有几种类型的值 1.基本数据类型 : 包括 Undefined.Null.Boolean.Number.String.Symbol (ES6 新增,表示独一无二的值) 特点 ...

随机推荐

  1. JQuery DataTables 列自己定义数据类型排序

    使用JQ DataTables 的时候.希望某列数据能够进行自己定义排序.操作例如以下:(以中文排序和百分比排序为例) 1:定义排序类型: //百分率排序 jQuery.fn.dataTableExt ...

  2. while 循环的理解

    if 与 while 的主要区别:if 只判断和执行一次,而 while 却代表着一个循环,执行多少次,要视情况而定: 两种情况(A.B)都会让循环体执行: while A or B: 两种情况(A. ...

  3. JS/CSS 在屏幕底部弹出消息

    <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title> ...

  4. (转)Tomcat调优

    问题定位 对于Tomcat的处理耗时较长的问题主要有当时的并发量.session数.内存及内存的回收等几个方面造成的.出现问题之后就要进行分析了. 1.关于Tomcat的session数目 这个可以直 ...

  5. Docker 搭建java+tomcat

    1. 准备java和tomcat的软件包 jdk-7u79-linux-x64.tar.gz apache-tomcat-7.0.57.tar.gz 2. 编辑Dockerfile 文件 vim Do ...

  6. Node.js笔记 http fs

    const http=require('http'); const fs=require('fs'); var server = http.createServer(function(req, res ...

  7. postman带cookie进行请求

    接口地址: https://m.xxxx.com/api/front/activity/xs/session 打开postman的headers, 然后复制fiddler中接口的cookie,设置co ...

  8. 洛谷——P2515 [HAOI2010]软件安装

    https://www.luogu.org/problem/show?pid=2515#sub 题目描述 现在我们的手头有N个软件,对于一个软件i,它要占用Wi的磁盘空间,它的价值为Vi.我们希望从中 ...

  9. Codeforces Round #426 (Div. 1) A.The Meaningless Game (二分+数学)

    题目链接: http://codeforces.com/problemset/problem/833/A 题意: 给你 \(a\) 和 \(b\),两个人初始化为 \(1\).两个人其中一方乘以 \( ...

  10. SQL Server2008 Hierarchyid数据类型

    以往我们在关系数据库中建立树状结构的时候,通常使用ID+ParentID来实现两条 纪录间的父子关系.但这种方式只能标示其相对位置.解决这类问题在SqlServer2005出现之前通常是采用游标来操作 ...