jQuery
$代表jQuery对象
以它开头的
function （）
window.onload=function(){} 的代替 $(function(){})
可以多次执行 边执行边加载
想返回原生对象dom $().get(0) 或者用js代码getelementgetid()
有时候引入两个库 胡造成混乱解决办法
jquery在第三方库之前 $所有权是后者的
故jQuery对象就不能再用$表示
可以在前面 用var$$=jQuery 就把$$赋值给jQUery对象
如果jQuery在第三方库的后面 就先用jQuery.noConfulict 将$权给后者
再var$$=jQuery
length=size()
高级选择器
> 只选择子节点
等同于 children（）
next()只获取当前节点的下一个同级节点
中间隔开会失效
~ nextAll() 下面所有的同级节点
prev prevAll 当前节点上一个的同级节点
siblings 上下同级的节点
nextuntil(p) 下面同级节点直到遇到P停止
prevuntil 上面同级节点知道遇到 停止
css解锁是从右到左 所以右越小 速度越快
当然用find children next等速度也很快 他采取的是新的算法
属性选择器
a[title] 具有title属性的a
a[title!=name] 不等于Name的
a[title|=name] 可以选择name-1 name-n n为数字 -不可少
a[title*=name] 只要包括Name就可以被选中
a[][] 多属性选择
过滤选择器
:first 该元素第一个
:last 该元素最后一个
:even 从0开始的偶数元素
:odd 从0开始的基数元素
:eq() 指定第几个元素 填入数字 负数的话向后算从-1开始
:gt() 从第几个元素开始
:focus 给焦点元素加css $().get().focus()默认情况下加上焦点
:content 通过文本选择一个元素
:empty 选择空的元素
:has（class） 子元素中包括这个class 这个父元素就被选中
parent() 选择当前元素父节点
parents（） 选择当前元素的祖宗节点
:hidden 选择所有不可见元素
:visible 选择所有可见元素
first-chlid 每个父节点的第一个子节点
last-child 每个父节点的第一个子节点
nth-child(n/even/odd/eq()) 传入参数每个父节点的第几个节点
$(class).is（$()） 选择器判断
检测class是否正确
eq返回jQuery对象 get()返回dom对象
$(class).is（function(){
return ($this)....
}） 自定义函数验证
$().slice(从第几个开始，到第几个)；
content（）.sizi() 返回所有节点数目
filter() 可以传多个过滤器
也可以自定义方法
html()获取html内容 html(value)替换html内容
html(function(index,value){})
text() 获取文本内容 text（value）可以替换text内容 但会被转意
val() 设置选定内容 下拉菜单和单选等 val([value值])
设置和删除属性
attr({'title':'title'}) 设置属性
attr(id/title) 获取属性
attr（title，function(index,value){ //index 是索引第几个 value是以前的值
return 。。。。
}）
removeAttr 删除属性
css样式
$().css(属性) 获取一个css样式属性
$().css(属性，“”) 设置一个样式
返回的是一个对象数组
遍历的时候用for(var i in class)
或者:
遍历原生态的对象数组 （直接用类名，标签名的）:
$.each(class,function(属性，value){
return....
})
遍历jQuery的对象数组（用$()表示的）
$().each(function(index,element){
return....
})
封装过的一些方法
.width() 直接获得一个数字 是该元素的长度
传参数表示设置该宽度 可以只传参不加单位
,width(function(){})
height 也相同
innerWidth width+padding 包括内边距
outerWidth width+padding+border 包括内边距和边框
outerWidth（true） width+padding+border+margin 包括内边距外边距边框
offset 返回一个对象
应用offset().left offset().top获得元素相对于窗口的偏移量
position
应用position().lest position().top 获得元素相对于父元素的偏移量
scroll
应用 scrollTop() 获得滚动条竖直的值 right相同
scrollTop(value) 设置滚动条竖直的值
class
$()addClass 增加一个或者多个class
$()removeClass 移除class
toggleClass(样式) 默认样式和制定样式的切换 一般以click !(第二参数可完成点击的频率问题)
节点的操作
$().append() 在一个元素内部添加一个节点在最后
appendTo 将指定元素移入一个元素内 一般用法appendTo(document.createElement())
prepend 用法一致 是添加在最前面
after() 在一个元素后面添加一个节点
before（） 在一个元素前面添加一个节点
insertAfter() 将指定节点插入一个元素后面
wrap(html/element) 用html或者element包裹一个节点
unwrap（）移除一层包裹的内容
wrapAll（） 用html或者element将所有元素包裹
wrapinner() 向指定元素的子节点包裹
表单原则器
:input 所有input
:text :button :select.....
返回的是元素的集合
表单过滤器
enabled 可用元素
disabled 不可用元素
checked 选取所有的被选中的元素 单选和复选
selectes 选取所有的被选中的元素 下拉列表
click
dbclick
mousedown
mouseup
mousemove
mouseover
mouseout
change
select
submit
keydown
keypress
keyup
blur
focus
resize
scroll
error
用bind封装
bind(type,date,function)
bind(type,funcName)
bind(type:function,type:function)
unbind（） 删除事件
可以填事件对象 也可以填事件的function
简写事件
click(function)
dblclick(function) 双击
mousedown(function) 鼠标按下
mouseup(function) 鼠标弹起
unload(function) 卸载一个页面 火狐不支持 其对象一般是window
resize(function) 窗口改变大小时
focus 必须是当前元素激活
focusin 可以是当前元素的子元素激活
bur
focusout 子元素可以激活
mouseout mousevoer 在子节点时也会激发
mouseenter mouseleave 只在离开当前节点才会触发
hover（function1,functon2） 复合事件 鼠标移入移出
事件对象 需要传参
type 获得这个时间类型
target 获得绑定事件的DOM对象 触发元素
currenTarget 监听元素 （绑定元素）
relateTarget 移入移出时最相邻的元素
date 获得额外数据
pageX 相对于页面原点的x位置
clientX 相对于页面视口的位置
screenX 相对于显示屏的位置
timeStamp 获得当前的时间戳
which 判断键盘鼠标的按键 鼠标左中右123
阻止冒泡行为
stopPropagation
阻止默认行为
preventDefault 可以用于表单不提交不跳转
若两个都想执行 用return false
isDefaultPrevented 是否调用阻止默认
isPropagationstopped 是否调用阻止冒泡
高级事件
trigger 模拟用户操作 打开网页就执行事件 额外数据，只有一条不用[]有多条要用[]
triggerHandler 1.不会执行默认行为 2.只会匹配一个元素 3.不会冒泡
命名空间bind("click.id",function)就给该click事件命名为id
事件委托 $(绑定元素--父元素)delegate(触发元素，触发形式，function) 为指定元素的一个或多个事件绑定事件
on和off代替bind.delegate
事件绑定 新元素节点不会事件 on(事件类型，function)
事件绑定 新元素节点也拥有该事件 on(触发形式，触发元素，function)
one()与on一致 但是只会执行一次事件触发
动画
show hide toggle 一个按钮实现
有两个参数
第一个是速度 单位是毫秒
第二参数是一个函数
默认同步动画 列队动画要用递归
silde 卷式动画 sildeup/down/toggle
fade 淡入淡出 fadeTo透明度到
自定义动画
animate(css改变，毫秒数，function)
通过改变定位，实现移动
实现列队：点缀和回掉
css不是动画方法 不会与动画方法同步
故用queue(function(){css})包裹css就可以达到排队效果
如果queue后面还有动画 必须传参数next,并用next()表示还要经行下一个
clearQueue清理列队
stop 停止一个动画
如果是列队动画 会停止第一个而执行其他动画
填入参数true会立即停止 清除后面动画 如果第二个参数是true 则直接运动到终点 不会变大变小
动画的全局变量
$.fx.interval 帧数越小越流畅
$.fx.off=true 关闭动画
axaj
$().load('php（url）',function(response,status，xhr){})静态文件的异步获取
post('url','key:value',funtion)
$.post不能使用？传参，post可以使用键值对方式传参
$.get('url','key:value',function)get用？传参 也可以键值对
第四个参数指定返回类型json xml php默认返回的是html和text
如果本来就是xml文件 强制转为html的话 返回值会带标签
$.ajax
（type,url,date,success:function）
$.ajaxSetup(){type,url,date} 可能会重复这几项数据所以将其封装 那么$.ajax中只用success
表单序列化
表单元素多时 date修改麻烦 会减少id的使用 以字符串返回 name+value
serialize()返回一般数据
json格式数据$(function() {
var data = $("form").serializeArray();
console.log(JSON.stringify(data, null, 4));
});
等待与超时，错误
$(document).ajaxStart 提交时运行
$(document).ajaxStop 提交完成时运行
ajax的第5个参数 timeout： 超时的时间
错误提示第6个参数 error:function(xhr,errorText,errorType){}
局部错误用.error（function）
全局错误用$(document).ajaxError(function(event,xhr,settings,info){})
请求前后
.ajaxSend(function) 请求之前
.ajaxCompete(function) 请求完成后 无论成功失败
.ajaxError
.ajaxSuccess
工具函数
$.trim()
$.each(arr,function) 遍历元素
$.map(arr,function) 修改数据
inArray 返回所找元素下标
merge合并数组
unique 删除重复DOM元素
Toarray 合并多个DOM元素
isArray
isFunction
isEmptyObjct
isPlianObjct 是否是一个纯粹的对象
contains 判断DOM节点是否包含一个DOM节点
type 判断数据类型
isNumeric 判断是否是一个数值
isWindow 判断数据是都是一个window对象
proxy() 调制this指针
json文件格式
[{key}:'value',{key}:'value']
composer config -g repo.packagist composer https://packagist.phpcomposer.com
composer create-project topthink/think composer_tp5 --prefer-dist