AjaxjQuery基本使用 笔记

1.JQuery骨干使用

JQuery中文API:

http://jquery.cuishifeng.cn/

http://hemin.cn/jq/

官方API:http://jquery.com/

1.1.简介:操作DOM的库

1.1.1.它是轻量级的js库 ,它优异CSS3,还优异各类浏览器(IE 6.0+, FF 1.5+,
Safari 2.0+, Opera 9.0+),jQuery2.0及后续版本将不再辅助IE6/7/8浏览器。

1.1.2.jQuery使用户能更便宜地处理HTML(标准通用标记语言下的一个拔取)、events、实现动画效果,并且有利于地为网站提供AJAX交互。

1.1.3.jQuery还有一个相比大的优势是,它的文档表达很全,而且各样应用也说得很详细,同时还有为数不少老谋深算的插件可供选拔。jQuery可以使用户的html页面保持代码和html内容分别,也就是说,不用再在html里面插入一堆js来调用命令了,只需要定义id即可。

1.1.4.怎么样学习库:大致精通api有什么,开发时再去查,不要每个都一一学习,否则跟不上时代。

1.2.下载:到百度CDN下载,如本文1.5.1

载入JQuery库

1.3.$符号—–>$(‘采纳器’)再次来到一个数组(若为空,则默认为document元素)

1.4.使用:$(选择器/对象).动作();

1.4.1.ready事件:html骨架准备完毕(什么看头呢,图片还没加载成功(但能获得到元素),ready事件就接触了)

留神:会杜绝html加载,图片会堵塞

1.4.2.onload事件:整个页面加载完毕(直到图片也加载出来的了)

1.4.3.绑定上述多少个事件:

ready:

业内写法

推荐简写:

简写

1.4.4.绑定点击事件:

方法1:

方法2:

瞩目:若DOM元素是动态变化的,需要特别处理

事件服从W3C标准

1.4.5.追加DOM元素

1.4.5.1.查API —文档处理—。。。

1.4.5.2.如图:

实例2:

1.4.5.3.对动态变化(追加)的DOM元素绑定事件的法门

.test —被追加的父元素

#myp —-追加的新因素

on —可换成delegate

—-事件代理体制,举行委托

似乎用on更好

1.4.6.安装属性

1.4.6.1.Style属性:文字颜色

1.4.6.2.批量装置css

1.4.6.3.API学习:

Ajax,概述

倘使存在(不设有)就删除(添加)一个类。——用于点一次,得到新class的性能,点两遍,消除class属性

1.4.6.4.jQuery 遍历的API

jQuery代码: 每张图片的src都设置为 textI.jpg

1.4.6.5.操作元素“属性”API(http://hemin.cn/jq/attr.html

2.JQuery动画原理和Ajax

2.1.JQuery动画

2.1.1.动画API —效果

(参考:http://hemin.cn/jq/index.html

动画API

2.1.2.jQuery自定义动画

2.1.3.诚如jQuery只做简单的卡通片,因为是通过js来操作DOM的,效能会相比低,效果不佳,会卡。做动画可以利用

Animate.css动画库:http://daneden.github.io/animate.css/

CSS3动画工具:http://www.f2e.name/case/css3/tools.html

JS动画库:velocity.js对Jquery的补充

requestAnimationFrame(百度补充),实现进度条的例证

http://www.cnblogs.com/Wayou/p/requestAnimationFrame.html

HTML5/CSS3时代,我们要在web里做动画选用实在早就重重了:

您可以用CSS3的animattion+keyframes;

您也足以用css3的transition;

您还足以用经过在canvas上制图来贯彻动画(游戏),也能够凭借jQuery动画相关的API方便地实现;

2.2.Ajax

参考:http://javascript.ruanyifeng.com/bom/ajax.html

注意:IE不支持

2.2.1.有些刷新,页面不跳转——-

l浏览器与服务器之间,拔取HTTP协议通信。用户在浏览器地址栏键入一个网址,或者经过网页表单向服务器交由内容,那时浏览器就会向服务器发出HTTP请求。

lAJAX通过原生的XMLHttpRequest对象发出HTTP请求,拿到服务器再次来到的多少后,再举行拍卖。

lAJAX可以是一块请求,也足以是异步请求。不过,大多数状态下,特指异步请求。因为联合的Ajax请求,对浏览器有“堵塞效应”。

lAjax指的是不刷新页面,发出异步请求,向劳动器端要求数据,然后再展开拍卖的形式。

l

2.2.2.jQuery的Ajax灰常方便

2.2.3.查看APIhttp://hemin.cn/jq/index.html

相关文章