jquary高级和ajax
jquary高级:
1、动画
1、三种方式显示与隐藏元素
1、默认显示和隐藏的方式
1、show([speed],[easing],[fn]):显示
[speed],[easing],[fn]
speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)
easing:(Optional) 用来指定切换效果,
默认是"swing",:
可用参数"linear":
fn:在动画完成时执行的函数,每个元素执行一次。
2、hide([speed],[easing],[fn]):隐藏
3、toggle([speed],[easing],[fn]):切换
2、滑动显示和隐藏
slideDown([speed],[easing],[fn])
slideUp([speed,[easing],[fn]])
slideToggle([speed],[easing],[fn])
3、淡入淡出显示和隐藏
fadeIn([speed,[easing],[fn]])
fadeOut([speed,[easing],[fn]])
fadeToggle([speed,[easing],[fn]])
2、遍历:
1.js的遍历
for(初始化值;循环条件;步长)
2、jquery的遍历
1、jq对象.each(callback)
//jq方式一:
citys.each(function (index,element) {
alert(index+":"+element.innerHTML)
})
2、$.each(obj,callback)
$.each(citys,function (index,element) {
alert(index+":"+element.innerHTML)
})
3、for……of:jq 3.0版本以后 提供的新方式
for(元素对象 of 容器对象)
for (element of citys){
alert(element.innerHTML);
}
3、事件绑定
jq对象.事件方法(callback);
注意:其实jq的方法的 js的方法 就是差一个on
ajax:
ajax:
异步的javaScript 和 xml
1、异步和同步:在客户端和服务器互相通信的基础上
同步:客户端必须等待服务器的响应,在等待期间不能做其他操作
异步:客户端不必等待服务器的响应,在期间能做其他操作
2、Ajax是一种无需重新加载整个网页的情况下,可以更新部分网页的技术
好处:提升用户体验
入门步骤:
js:原生实现方式(今天作业)
jq:一共有5种 ,其中3种
$.ajax({}): 就是一个方法
语法:
$.ajax({
url:"/ajaxServlet",//请求路径
type:"post",//请求方式
data:"username=coco&age=12",//请求参数
success:function(obj){ //请求成功 执行方法
//obj 表示 接收 服务器回写的内容
},error:function(){//请求失败 执行方法
},
dataType:"json" //服务器响应的数据格式
})
$.post()
jQuery.post(url, [data], [callback], [type])
$.get()
jQuery.get(url, [data], [callback], [type])
url:待载入页面的URL地址
data:待发送 Key/value 参数。
callback:载入成功时回调函数。
type:返回内容格式,xml, html, script, json, text, _default。
jquary高级和ajax的更多相关文章
- 21. javacript高级程序设计-Ajax与Comet
1. Ajax与Comet 1.1 XMLHttpRequest对象 IE5是第一款引入XHR对象的浏览器,IE5中是通过MSXML库中的一个ActiveX对象实现的.因此在IE中可能存在MSXML2 ...
- jQuary学习の五のAJAX
AJAX 是与服务器交换数据的技术,它在不重载全部页面的情况下,实现了对部分网页的更新. 一.jQuery load() 方法 jQuery load() 方法是简单但强大的 AJAX 方法. loa ...
- jQuery笔记之工具方法—高级方法Ajax
$.ajxa() ——基本使用 前提:先了解js的执行机制 $.Callbacks()——回调 $.Deferred()——异步 $.when() 网络服务器链接由<渡一教育>提供 --- ...
- jQuery 第十章 工具方法-高级方法 $.ajax() $.Callbacks() .....
$.ajax() $.Callbacks() $.Deferred() .then() $.when() ---------------------------------------------- ...
- 高性能javascript学习笔记系列(6) -ajax
参考 高性能javascript javascript高级程序设计 ajax基础 ajax技术的核心是XMLHttpRequest对象(XHR),通过XHR我们就可以实现无需刷新页面就能从服务器端读 ...
- 最新JavaScript、Ajax典藏级学习资料下载分类汇总 (2011年12月21日更新)
其他网站开发相关资料 超强HTML和xhtml,CSS精品学习资料下载汇总 最新htm ...
- JavaScript高级程序设计(第三版)学习笔记20、21、23章
第20章,JSON JSON(JavaScript Object Notation,JavaScript对象表示法),是JavaScript的一个严格的子集. JSON可表示一下三种类型值: 简单值: ...
- JavaScript(10)——Ajax以及跨域处理
Ajax以及跨域处理 哈哈哈,终于写到最后一章了.不过也还没有结束,说,不要为了学习而学习,恩.我是为了好好学习而学习呀.哈哈哈.正在尝试爱上代码,虽然有一丢丢的难,不过,我相信我会的! [Ajax] ...
- AJAX的前世今生与未来
一.通过三个问答来认识一下Ajax 什么是Ajax? Ajax是Asynchronous Javascript And XML的缩写,它是一种技术. Ajax有什么用? 这一技术能够向服务器请求额外的 ...
随机推荐
- 客户端不能连接MySQL - 2003-Can't connect to MySQL server on '192.168.43.180'(10060 "Unknown error")
客户端不能连接MySQL 场景: 数据库(此处以MySQL为例)安装在虚拟机里面,在宿主机上进行连接数据库的时候始终不能连接,但在虚拟机中使用正常. 针对上面的场景: 1. 在虚拟机里面可以正常使用M ...
- MySQL根据出生日期计算年龄
以前使用mysql不是很多,对mysql的函数也不是很熟悉,遇到这个问题第一时间百度搜索,搜索到这两种方法,这两种方法是排在百度第一条的博客. 方法一 SELECT DATE_FORMAT(FROM_ ...
- day21 python之模块和包
一 模块 1 什么是模块? 常见的场景:一个模块就是一个包含了python定义和声明的文件,文件名就是模块名字加上.py的后缀. 但其实import加载的模块分为四个通用类别: 1 使用python编 ...
- maven 安装m2e 报错
Eclipse安装maven插件m2e m2e - http://m2eclipse.sonatype.org/sites/m2e m2e-extras - http://m2eclipse.sona ...
- IP通信基础学习第七周(上)
局域网的优点:具有广播功能,从一个站点可以方便的访问全网,局域网上的主机可共享连接在局域网上的各种资源:便于系统的扩展和逐渐地演变,各设备的位置可灵活调整和改变:提高了系统的可靠性.可用性和生存性. ...
- BP神经网络(原理及MATLAB实现)
人工神经网络概述: 人工神经元模型: 神经网络的分类: 按照连接方式,可以分为:前向神经网络 vs. 反馈(递归)神经网络: 按照学习方式,可以分为:有导师学习神经网络 vs. 无导师学习神经网络: ...
- Navicat Premium 简体中文版 12.0.16 以上版本国外官网下载地址(非国内)
国内Navicat网址是:http://www.navicat.com.cn 国外Navicat网址是:http://www.navicat.com 国外的更新比国内的快,而且同一个版本,国内和国外下 ...
- coredump文件抓取设置
ulimit -c unlimitedecho 1 > /proc/sys/kernel/core_uses_pidecho "/tmp/core-%e-%s-%u-%g-%p-%t& ...
- React Hooks (React v16.7.0-alpha)
:first-child{margin-top:0!important}.markdown-body>:last-child{margin-bottom:0!important}.markdow ...
- vue项目创建过程
在使用vue-cli之前,请确认你的电脑已经安装了 node,建议版本在 8.0.0 以上 可以通过node -v 检查版本 1.安装 vue-cli (这里我们确认已安装过node) 1.使用 np ...