jQuery基本使用 笔记

一.JQuery主导接纳

JQuery中文API:

http://jquery.cuishifeng.cn/

http://hemin.cn/jq/

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

1.1.简介:操作DOM的库

一.一.1.它是轻量级的js库 ,它非常CSS三,还合作各样浏览器(IE 陆.0+, FF 1.伍+,
Safari 二.0+, Opera 九.0+),jQuery二.0及后续版本将不再补助IE6/7/八浏览器。

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

1.1.三.jQuery还有2个比较大的优势是,它的文书档案表达很全,而且各类应用也说得很详细,同时还有众多成熟的插件可供选用。jQuery能够使用户的html页面保持代码和html内容分别,也便是说,不用再在html里面插入一群js来调用命令了,只需求定义id即可。

一.一.4.怎么样学习库:大约驾驭api有如何,开发时再去查,不要各类都一1学习,不然跟不上时期。

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:

2018正版葡京赌侠诗,专注:若DOM成分是动态变化的,需求尤其处理

事件遵守W3C标准

1.4.5.追加DOM元素

1.四.伍.壹.查API —文书档案处理—。。。

1.4.5.2.如图:

实例2:

一.四.伍.三.对动态变化(追加)的DOM成分绑定事件的主意

.test —被追加的父成分

#myp —-追加的新因素

on —可换成delegate

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

似乎用on更好

1.4.6.设置属性

一.4.6.1.Style属性:文字颜色

壹.四.六.2.批量设置css

1.4.6.3.API学习:

概述

设若存在(不设有)就删除(添加)二个类。——用于点三回,获得新class的性质,点壹遍,消除class属性

1.4.6.4.jQuery 遍历的API

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

一.四.陆.伍.操作成分“属性”API(http://hemin.cn/jq/attr.html

贰.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/CSS三时代,大家要在web里做动画选择实在已经重重了:

您能够用CSS三的animattion+keyframes;

您也得以用css3的transition;

你还能用经过在canvas上绘制来完结动画(游戏),也可以依靠jQuery动画相关的API方便地贯彻;

2.2.Ajax

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

注意:IE不支持

2.二.一.片段刷新,页面不跳转——-

l浏览器与服务器之间,选择HTTP协议通讯。用户在浏览器地址栏键入二个网站,或然通过网页表单向服务器交由内容,那时浏览器就会向服务器发出HTTP请求。

lAJAX通过原生的XMLHttpRequest对象发出HTTP请求,获得服务器重回的数据后,再开始展览拍卖。

lAJAX能够是3只请求,也足以是异步请求。可是,大部分动静下,特指异步请求。因为共同的Ajax请求,对浏览器有“堵塞效应”。

lAjax指的是不刷新页面,发出异步请求,向劳动器端供给数据,然后再实行处理的格局。

l

2.2.2.jQuery的Ajax灰常方便

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

相关文章