Ajax,纯Js+Jquery
AJAX:Asynchronous Javascript and xml 异步,Js和Xml 交互式网页开发 不刷新页面,与服务器交互 详情请参照Jquery工具指南
用在浏览器端的技术,无刷新,通过XmlHttpRequest访问页面
纯js版----------
if(XmlHttpRequest){ //判断是否支持XmlHttpRequest
xhr= new XmlHttpRequest(); // 创建XmlHttpRequest对象
}
else{
xhr= new Activexobject("Microsoft.XMLHTTP"); //不支持XmlHttpRequest,使用此方法创建
}
xhr.open("get|post","url",true);
xhr.send(); // 开始发送
xhr.onreadystatechange= function(){ // 回调函数,当服务器将数据返回给浏览器触发方法
if(xhr.readyState==4) //0没调用open方法,1表示未调用send方法,2正在等待状态码和头的返回,3 已接受部分数据,但还没接受完,不能使用该对象的属性和方法,4已加载,所有数据执行完毕
if(xhr.status==200){ // 响应状态码,表示页面执行无误
alert(xhr.responseText); // 输出接受到的文本
}
}
发送post请求
在send中写数据。并添加请求报头
如
xhr.setRequestHeader("Content-Type",application/x-www-form-urlencoded)
xhr.send("id=123&pwd=456");
-------------------------------------
Jquery版
强大的Jquery。。只需要get页面就够了
$.get("url",{"id" : "123","pwd":456},function(data)){ //自动把参数当做get请求传输
alert(data)
}
只需要post页面。
$.post("url",{"id" : 123,"pwd":456},function(data)){ //post请求
alert(data)
}
//第三种写法
$.ajax({
type="get"| post,
url="...",
data:"参数",
success:function(msg){...} // msg为从服务器接受到的数据
})
Ajax,纯Js+Jquery的更多相关文章
- 不用框架使用ajax 纯js使用ajax post,get范例及其区别
原文发布时间为:2009-11-15 -- 来源于本人的百度文章 [由搬家工具导入] 不用框架使用ajax 纯js使用ajax post,get范例及其区别 ===================== ...
- jQuery+AJAX实现纯js分页功能
使用jQuery的AJAX技术,在bootstrap的框架下搭建的纯js分页 bootstrap作为Twitter推的一款前端框架,效果个人还是觉得很不错的.这次只是拿来作为网页元素的css样式表使用 ...
- 纯 js 让浏览器不缓存 ajax 请求
开发「bufpay.com 个人即时到账收款平台」支付页面需要用到 ajax 轮询订单的支付状态. 现在浏览器对 ajax 的缓存策略遵循 http response header 里面的缓存设置,为 ...
- 纯js实现瀑布流布局及ajax动态新增数据
本文用纯js代码手写一个瀑布流网页效果,初步实现一个基本的瀑布流布局,以及滚动到底部后模拟ajax数据加载新图片功能. 缺点: 1. 程序不是响应式,不能实时调整页面宽度: 2. 程序中当新增ajax ...
- jQuery Ajax通用js封装
第一步:引入jQuery库 <script type="text/javascript" src="<%=path%>/resources/js/jqu ...
- 笔记 jsp/ajax/js/jquery/html5/css+div->table
1. jsp 1).jsp(39,33) equal symbol expected: 这个异常是说第39行有 " '( 冒号单引号)问题 2)${map[key]} map和key换 ...
- JavaScript、Ajax与jQuery的关系 分类: C1_HTML/JS/JQUERY 2014-07-31 10:15 3388人阅读 评论(0) 收藏
简单总结: 1.JS是一门前端语言. 2.Ajax是一门技术,它提供了异步更新的机制,使用客户端与服务器间交换数据而非整个页面文档,实现页面的局部更新. 3.jQuery是一个框架,它对JS进行了封装 ...
- 实现简单的PHP接口,以及使用js/jquery ajax技术调用此接口
主要介绍下如何编写简单的php接口,以及使用js/jquery的ajax技术调用此接口. Php接口文件(check.php): <?php $jsonp_supporter = $_GET[‘ ...
- js jQuery函数 $.ajax()
$.ajax() //$表示是jQuery cache: 要求为Boolean类型的参数,默认为true(当dataType为script时,默认为false),设置为false将不会从浏览器缓存中 ...
随机推荐
- line-height属性总结
line-height属性的继承性: 子元素不设置line-height时, 在父元上设置带单位的值和百分比时会先计算父元素的line-height大小然后继承过来,在父元素上设置无单位的数值时,子 ...
- 老李分享:robotium常用API 1
老李分享:robotium常用API robotium常用API Robotium中最重要的类Solo类:其中提供了模拟用户活动的点击.搜索.拖拽等方法. 英文api(经常断开连接打不开):htt ...
- 上传图片转为base64格式预览并压缩图片(不兼容IE9以下浏览器,兼容移动端ios,android)
前些天公司要求在微信移动端做上传图片并预览的功能,要求能够调用摄像头拍照并立即预览. 在网上搜了一些方法,开始自己写了个简单的功能实现代码.结果发现移动端拍照出来的图片动不动就2M+,又因为要批量上传 ...
- Nginx基础学习(一)—Nginx的安装
一.Nginx介绍 1.什么是Nginx? Nginx是一款高性能的http 服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器.由俄罗斯的程序设计师Igor Sysoev所开 ...
- 【 js 基础 】 深浅拷贝
underscore的源码中,有很多地方用到了 Array.prototype.slice() 方法,但是并没有传参,实际上只是为了返回数组的副本,例如 underscore 中 clone 的方法: ...
- 哥哥我刚学的java---------数组插入法------------
package charufa; public class Test02 { // 插入法(插入一个数字). public static void main(String[] args) { int[ ...
- sql server 数值的四舍五入
sql中的四舍五入通常会有round 和cast( …… as decimal())两种方式: 个人建议使用cast 方式: 方式1: 经过试验,同样都可以做到四舍五入,但round如下实例1会报 ...
- angular双向数据绑定
<body ng-app> //三个view都会变 <input type="text" ng-model="name" value=&quo ...
- 泛型(CSDN转载)
函数的参数不同叫多态,函数的参数类型可以不确定吗? 函数的返回值只能是一个吗?函数的返回值可以不确定吗? 泛型是一种特殊的类型,它把指定类型的工作推迟到客户端代码声明并实例化类或方法的时候进行. 下面 ...
- PMD教程
1.单词 violations outline:错误大纲2.错误级别 红色 很高的错误 橙色 错误 黄色 很高的警告 绿色 警告 蓝色 输出信息3.提示 Avoid excessively long ...