jquery和ajax的关系详细介绍
JQuery、AJAX都是Javascript的一个框架,各有各自不同的功能,如果把Javascript比作父亲的话,JQuery和AJAX就是Javascript的亲生儿子。在Javascript中非常复杂的功能,让他们实现起来是极其的方便快捷。下面来总结一下他们各自的功能及特点和应用的场合。
JQuery是轻量级的js库,它兼容CSS3,还兼容各种浏览器 (IE 6.0+, FF1.5+, Safari 2.0+, Opera 9.0+)。jQuery使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery同时还有许多成熟的插件可供选择。jQuery能够使用户的html页保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可。
JQuery的宗旨是——WRITE LESS,DO MORE,也就是“吃得少,干的多”。让我们广大的程序员能够写更少的代码,做更多的事情。
而JQuery在什么时候使用呢?和上边说的类似,它主要的用处就是:
1. 选择器
通过$符号可以快速、精确的定位到指定的元素。选择器包括:基本选择器、层次选择器、过滤选择器、表单选择器
2. 对DOM操作
通过$符号找到DOM元素,对属性进行操作;添加删除节点;对样式进行操作;设置获取HTML文本和值;遍历子元素或同辈元素;添加事件
3. 表单验证
4. 动画效果
5. ajax
上边总结的是JQuery,下面再继续总结AJAX。
AJAX即“AsynchronousJavaScript and XML”(异步JavaScript和XML)。所谓的异步就是在事件触发之后浏览器任然可以做其他的事情,与发生事件的控件无关的控件不受影响。AJAX是一种用于创建更好更快以及交互性更强的 Web 应用程序的技术。
如果仅仅学会使用.net中的AJAX的几个控件,也许你根本就理解不了AJAX中的Javascript和XML到底是怎么回事,这些控件是对他们的封装,微软让我们方便了很多,但是这是一种“傻瓜式”的使用方法。要想深刻的理解其中的Javascript和XML的使用,还需要掌握客户端是怎么接受Webservice(.asmx)和WCF(.svc)和一般处理程序(.ashx)文件的使用方法
那一般什么时候使用AJAX,什么时候使用AJAX比较合适呢?一般都是用在页面局部发生变化的地方。如下:
1. 基于表单的交互
2. 深层树状导航
3. 实时用户对用户通讯
4. 投票、是否选择、等级评价
5. 过滤和复杂数据操作
6. 普通录入时的提示/自动补齐
不适用使用AJAX的场合:
1. 简单的表单
2. 搜索
3. 基本导航
4. 替换大量的信息
5. 显示操作
6. 无用的网页小部件
相关推荐
-
探讨jQuery的ajax使用场景(c#)
一:jQuery.ajax语法基础 jQuery.ajax([options]) 概述:通过 HTTP 请求加载远程数据. jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.使用这个方法可以获得更多的灵活性. 数据类型$.ajax()函数依赖服务器提供的信息来处理返回的数据.通过dataType选项还可以指定其他不同数据处理方式.其中,text和xml类型返回的数据不会经过处理.如果指定为
-
jQuery中使用Ajax获取JSON格式数据示例代码
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式.JSONM文件中包含了关于"名称"和"值"的信息.有时候我们需要读取JSON格式的数据文件,在jQuery中可以使用Ajax或者 $.getJSON()方法实现. 下面就使用jQuery读取music.txt文件中的JSON数据格式信息. 首先,music.txt中的内容如下: 复制代码 代码如下: [ {"optionKey":"1"
-
jquery ajax中使用jsonp的限制解决方法
jsonp 解决的是跨域 ajax 调用的问题.为什么要跨域 ajax 调用呢?这样可以在一个应用中直接在前端通过 js 调用另外一个应用(在不同的域名下)的 API.我们在实际应用中也用到了 jsonp ,但之前只知道 jsonp 的一个限制,只能发 get 请求,get 请求的弊端是请求长度有限制.今天,发现 jsonp 的另外一个限制(在jquery ajax的场景下) -- 不会触发 $.ajax 的error callback,示例代码如下: 复制代码 代码如下: $.ajax({
-
jquery和ajax的关系详细介绍
JQuery.AJAX都是Javascript的一个框架,各有各自不同的功能,如果把Javascript比作父亲的话,JQuery和AJAX就是Javascript的亲生儿子.在Javascript中非常复杂的功能,让他们实现起来是极其的方便快捷.下面来总结一下他们各自的功能及特点和应用的场合. JQuery是轻量级的js库,它兼容CSS3,还兼容各种浏览器 (IE 6.0+, FF1.5+, Safari 2.0+, Opera 9.0+).jQuery使用户能更方便地处理HTML docum
-
jQuery之ajax技术的详细介绍
1:Ajax技术包含以下几点:基于Web标准(XHTML + CSS)的展示使用DOM进行动态显示和交互使用XMLHttpRequest进行数据交换和相关操作使用javascript将所有内容绑定在一起Ajax的核心是JavaScript的XMLHttpRequest对象,它是一种支持异步请求的技术.简而言之,使用JS可以控制XMLHttpRequest对象向服务器提出请求并处理响应,而不影响用户对页面的正常访问.对于XMLHttpRequest对象,不同的浏览器提供了不同的支持,IE是将其作为
-
JavaScript、jQuery与Ajax的关系
在上篇文章给大家介绍了javascript jquery ajax的小结,今天接着给大家介绍javascript jquery与ajax的关系,感兴趣的朋友一起学习吧 简单总结: 1.JS是一门前端语言. 2.Ajax是一门技术,它提供了异步更新的机制,使用客户端与服务器间交换数据而非整个页面文档,实现页面的局部更新. 3.jQuery是一个框架,它对JS进行了封装,使其更方便使用.jQuery使得JS与Ajax的使用更方便 详细情况: Actually only one of them is
-
JQuery入门—JQuery程序的代码风格详细介绍
<jQuery权威指南>第1章jQuery开发入门,本章通过循续渐进的方式,先从jQuery的基础概念入手,介绍jQuery库的下载,引入简单应用方法:后部分侧重于jQuery控制DOM对象和页面CSS样式的介绍,通过一些简单的小示例,使读者对jQuery在页面中的功能应用有一个大致的了解,为下一章节进一步学习jQuery库的详细对象和方法奠定基础.本节为大家介绍jQuery程序的代码风格. 1.1.5 jQuery程序的代码风格 1."$"美元符的使用 在jQuery程序
-
jQuery 数据缓存模块进化史详细介绍
数据缓存系统最早应该是jQuery1.2引入的,那时它的事件系统完成照搬DE大神的addEvent.js,而addEvent在实现有个缺憾,它把事件的回调都放到EventTarget之上,这会引发循环引用,如果EventTarget是window对象,又会引发全局污染.有了数据缓存系统,除了规避这两个风险外,我们还可以有效地保存不同方法产生的中间变量,而这些变量会对另一个模块的方法有用,解耦方法间的依赖.对于jQuery来说,它的事件克隆乃至后来的列队实现都是离不开缓存系统. jQuery1.2
-
给artDialog 5.02 增加ajax get功能详细介绍
之前用过artDialog 5.0之前版本,非常佩服作者的创意和敬业精神,现在新版的功能朝着轻量级js的方便发展,我还是比较喜欢之前artDialog.open的功能,直接方便.但就是之前版本有点大,我现在只想在artDialog增加一点从ajax get远程内容,我的代码如下: 复制代码 代码如下: $.extend({ _htmlDataArr:new Array(), _findHTML:function(url){ var hd_len= $._htmlDataArr.length; f
-
ASP.NET中Web.config文件的层次关系详细介绍
Web.config 是一个基于 XML 的配置文件,该文件的作用是对应用程序进行配置,比如规定客户的认证方法,基于角色的安全技术的策略,数据绑 定的方法,远程处理对象等. 可以在网站的根目录和子目录下分别建立自己的 Web.config 文件,也可以一个Web.config 文件都不建立,Web.config 并不是网站必备的文件.这是因为服务器有一个总 的配置文件,名为"Machine.config" ,默认安装在"C:\Windows\Microsoft.NET\ Fr
-
jQuery Deferred和Promise创建响应式应用程序详细介绍
这篇文章,我们一起探索一下 JavaScript 中的 Deferred 和 Promise 的概念,它们是 JavaScript 工具包(如Dojo和MochiKit)中非常重要的一个功能,最近也首次亮相于 流行的 JavaScript 库 jQuery(已经是1.5版本的事情了). Deferred 提供了一个抽象的非阻塞的解决方案(如 Ajax 请求的响应),它创建一个 "promise" 对象,其目的是在未来某个时间点返回一个响应.如果您之前没有接触过 "promis
-
详细解读Jquery各Ajax函数($.get(),$.post(),$.ajax(),$.getJSON())
一,$.get(url,[data],[callback]) 说明:url为请求地址,data为请求数据的列表,callback为请求成功后的回调函数,该函数接受两个参数,第一个为服务器返回的数据,第二个参数为服务器的状态,是可选参数. 而其中,服务器返回数据的格式其实是字符串形势,并不是我们想要的json数据格式,在此引用只是为了对比说明 $.get("data.php",$("#firstName.val()"),function(data){$("#
-
jQuery中ajax的4种常用请求方式介绍
AJAX 是一种与服务器交换数据的技术,可以在补充在整个页面的情况下更新网页的一部分. jQuery中ajax的4种常用请求方式: 1.$.ajax()返回其创建的 XMLHttpRequest 对象. $.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息.详细参数选项见下. 如果你指定了 dataType 选项,请确保服务器返回正确的 MIME 信息,(如 xml 返回 "text/xml"). 实例: 保存数据到服务器,成功时显示信息. $.aj
随机推荐
- 关于vue-resource报错450的解决方案
- Android Framework Application Framework层简单介绍
- 让python json encode datetime类型
- JavaScript实现购物车基本功能
- 一句话 asp木马加密版 彻底突破杀毒软件
- docker学习笔记之把容器commit成镜像的方法
- 关于PHP实现异步操作的研究
- 4种JavaScript实现简单tab选项卡切换的方法
- 什么是Ajax
- Javascript Memoizer浅析
- CSS导航菜单,三级菜单实现代码
- ibmx335/ibmx336服务器做RAID阵列的图文方法(包括删除RAID阵列)
- ES6概念 ymbol.for()方法
- Android编程实现悬浮窗获取并显示当前内存使用量的方法
- .Net Core简单使用Mvc内置的Ioc(续)
- Android仿京东分类模块左侧分类条目效果
- Flask入门之上传文件到服务器的方法示例
- 易语言字体设置的步骤
- python实现简单五子棋游戏
- Vue组件库发布到npm详解