码迷,mamicode.com
首页 > Web开发 > 详细

锋利的jQuery笔记

时间:2014-11-01 23:09:07      阅读:280      评论:0      收藏:0      [点我收藏+]

标签:io   os   ar   for   sp   strong   数据   div   on   

1.jquery 选择器:

1.  :not()不含有

2.  :gt(num)选择第num+1之后的所有元素

3. fiter(exper)  筛选出指定表达式匹配元素的集合 对自身元素进行筛选

4. find() 筛选出自身子集操作

5. :contains(‘str‘)  包含指定字符串str的

6. div:visible  选取所有可见得的DIV元素

7.div:hiden  和上面相反

8 :enable 选取所有可用元素

9 :disabled 选取所有不可用元素

10 :checked 被选中的元素(单选框,复选框)

11  :selected 选取所有被选中的选项元素(下拉列表)

12 li:eq(2)获取li中第三个li节点

 

2jquery中的DOM操作

1. text()设置该匹配元素的文本内容

2. var $li_1=$("<li></li>")

$("ul").append(&li_1);添加到UL节点中是只能在网页中显示

3. append() 在每个匹配元素内部追加内容

4. prepend() 向每个匹配的元素内部前置内容

5. after() 向每个匹配的元素之后插入内容、

6. befor() 向每个匹配的元素之前插入内容

7删除节点有三个方法:

1. remove()删除所匹配的元素

2. detach()删除 但是会保留绑定的事件和附加的数据

3. empty()清空元素中所有后代节点

8 复制节点:$(this).clone().appendTo("ul");复制当前节点并将它追加到,<ul>元素中

9 替换节点 replaceWith()  replaceAll()与replaceWith()用法相同只是颠倒了一下操作

$("p").replaceWith("<a>ddd<a/>")

$("<a>ddd</a>").replaceAll("p")

10 包裹节点

$("strong").wrap("<b></b>")

wrapAll()给所有匹配的元素用一个元素来包裹

$("strong").wrapInner("<b></b>")在strong标签内的内容被一对<b>标签包裹

 

11属性操作

attr()方法来获取和设置元素属性,removeAttr()方法来删除属性

toggle(fn,fn)   交替执行代码

toggleClass()  如果类名存在则删除它,不存在则添加他

hasClass()可以判断元素中是否含有某个class如果有返回true,否则返回false

等价于.is(".")方法

 

val() 可以用来设置和获取元素的值,也可以是select,checkbox,radio相应的选项被选中

$(":checkbox").val(["check2","check3"])

$(":radio").val(["radio1"])

$("#single option:eq(1)").attr("selected",true)

radio checked true

 

this.defaultValue就是当前文本框的默认值

 

focus()方法  用于处理获得焦点时的事件

blur()方法  处理失去失焦时的事件

 

遍历节点:

 

childen() 取得匹配元素的子元素集合。且只考虑子元素不考虑其他后代元素

next() 取得匹配元素后面紧邻的同辈元素

prev()取得匹配元素前面紧邻的同辈元素

silbings()  用于取得匹配元素前后的所有同辈元素

closest() 该方法用于取得最近的匹配元素如果匹配直接返回本身,不匹配向上查找父元素直到找到匹配元素

parent()  获得集合中每隔匹配元素的父级元素

parents() 获得集合中每个匹配元素的祖先元素

css(" "," ")

offset() 获取元素在当前视窗的相对偏移

position()相对于最近一个样式属性设置为relative或者absolute的祖父节点的相对偏移与offset一样返回top和left两个属性

scrollTop()

scrollLeft()

 

 

 

jquery中事件和动画

$(document).ready(function(){})===$(function(){})===$().ready(function(){})

 

bind(type[,data],fn)匹配元素并 进行事件绑定

 

hover(enter,leave)移动到 移动出  分别触发两个事件

toggle(fn1,fn2,fn3,……fnN)连续单击事件

 

阻止事件冒泡:

$("").bind("",function(event){

event.stopPropagation();

})

 

阻止默认行为:如表单不符合提交,阻止表单的提交

function(event){  event.preventDefault();}

如果既想阻止事件冒泡,又想阻止默认行为,可以return false;

 

事件对象属性:

event.type  获取事件的类型

event.preventDefault()  阻止默认事件行为

event.stopPropagation() 阻止事件冒泡

event.target()获取到触发事件的元素

event.pageX光标相对于页面的X坐标

event.pageY光标相对于页面的Y坐标

event.which 在鼠标单击事件中获取到鼠标左中右,在键盘事件中获取键盘的按键

event.metaKey获取ctrl按键

移除事件

$(‘‘).unbind();

unbind(type,data)第一个是事件类型,第二个是移除的函数

没有参数则删除所有绑定事件,

 

对于只需要触发一次即可立即解除绑定的情况用one()

one(type,data,fn)用法与bind()类似

 

锋利的jQuery笔记

标签:io   os   ar   for   sp   strong   数据   div   on   

原文地址:http://www.cnblogs.com/hengqianduan/p/4067863.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!