JQuery入门

 

$ = window.jQuery=jQuery;

选择id用#

$('#id')

$('div')  直接标签名

$('.class')  .+类名

$('*') 通配符

$('a,div,.class')  多项选择器

$('div a')  空格选择后代

$('parent > child')  只选择下一层的父子

$('prev + next')  选择同一层紧接着prev的next标签

$('prev ~ siblings')  选择本同一层兄弟标签，共同父亲的

属性名 比如包含属性的lang  type都会选择出来

^=   表示以value开头就行

$=   表示  以value结尾  和正则表达式相同

*=  表示包含 value 就行  可以匹配

[selector1][selector2][selector3]  满足多个条件选择

用法就是  $('#')    #表示上面图标的使用

 

过滤器：

$('class > p:first-child') 过滤class下第一个孩子是p标签的孩子

nth-child(2) 表示选择第2个孩子  不和数组的0一样，从第一个开始

nth-last-child(2) 倒数第二个孩子

only-child 只有一个孩子

$('class:first-of-type')   

$('class > p:first-of-type')     只要是第一个p标签或者存在一个p标签即可

而 child是子类的位置，不是存在与第几个

 

其中参数

n  匹配第几个 从1开始

odd  匹配奇数个

even  偶数

2n  偶数  2n+1  奇数 也是带入1的坐标

可以是别的特殊公式

 

 

表单相关

:input  找到表单

:text   匹配单行文本框

:enabled 可用的

:disabled   不可用的

:checked 被选中的  用于select 的option 复选 单选

:selected  所有option元素

 

查找

$('select').find('.javascripts');  选择 select的里面的元素 包括孙子等所有后代

$('select').children('option');      只找到孩子 不包括孩子的孩子

$('select').parent();  找到父亲  不可能有多个父亲 ，不用填参数，也可以填用于判断是否是其父亲

.next()

.prev()  查找下一个  上一个

.eq(n) 数组的第几个元素

 .siblings()  找到兄弟 可以不写

.filter('.python') 找到python类

filter可以代替上面很多方法

 

.click 单击  .dbclick双击

mousedown  mouseup    点下  松开

mounseenter  mounseleave   进入离开

hover([over],out)  悬浮鼠标  进入时候可以省略  离开不可以

mouseover  mounseout  进入 离开

mounsemove([data],fction)  移动

scroll([],fction) 滚动

键盘事件

keydown([[data],fction])

$(document).keydown(function(){})

$(document).keydown(function(event){}) 其中event可以有keyCode   event.keyCode 可以控制效果

keyup()

keypress()   参数都一样  按下后就发生

 

其他事件

ready   加载完执行

resize([[data],fnc])  只要改变浏览器大小  使用window

focus  获得焦点  blur  失去焦点

change  发生改变 比如在input 中

select  例如表单中被选择 

submit  提交表单时  

 

以上参数都和resize一样

 

事件参数

event 可以获取很多信息

例如 event.key  event.keyCode

 

事件绑定与取消

.on(events,[selector],[data],fction)

 

事件取消

off

 

one  绑定一次性的事件，运行完自动解绑

 

bug:

html与index同步  防止图片出错

函数值初始化

 

动画