jQuery

Posted 1607470370-li

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery相关的知识,希望对你有一定的参考价值。

jQuery

选择器

$(this) 选择当前html元素

$(“p")  选择所有<p>元素

$(".left") 选择所有类名为left的元素

$("p.left") 选择所有类名为left的p标签

$(“#id”) 选择id为id的元素

$("#id p") 选择id下的所有p标签

$("ul li:first")选择<ul>中的第一个<li>元素 first改为last结果相反

$("tr:even")选择所有偶数tr元素

$("tr:odd")选择所有奇数tr元素

$("ul li:eq(0)")选择ul中的第一个li元素

$("ul li:eq(2)")选择ul中的第3个li元素

$("h2,h3")选择所有h2和h3元素

特效:

隐藏显示

hide(“slow”)隐藏慢速

hide(“fast”)隐藏快速

show(“1000”)显示1秒

Toggle(2000)隐藏与显示切换 两秒

淡入淡出

fadeln(“show”)淡入慢速

fadeOut(“slow”)淡出慢速

fadeTo(1000,.0.5)不透明0.5,一秒

fadeToggle(2000)淡入、淡出切换,两秒

滑入滑出

slideUp(“slow”)滑出慢速

slideDown(“fast”)滑入快速

slideToggle(2000)滑入滑出切换,两秒

动画

animate({width:‘200px’,height:‘100px’},“slow”)

动画形式,宽度变成200px;高度变成100px, 慢速

stop() 方法用于停止动画或效果,在它们完成之前。适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。

jQurey chaining  在相同的元素上运行多条 jQuery 命令,一条接着另一条。

$("#p1").css("color","red")
  .slideUp(2000)
  .slideDown(2000);
$("#p1").css("color","red").slideUp(2000).slideDown(2000);

jQuery HTML

text() 设置返回所有元素的文本内容
html() 设置返回所选的元素内容包括html标记
val() 设置返回表单字段的值

append()在被选取元素的结尾插入内容
prepend() 在被选元素的开头插入内容
after() 在被选元素之后插入内容
before() 在被选元素之前插入内容

remove()删除被选元素
empty() 从被选取元素中删除子元素

addClass()向被选取元素添加一个或多个类名
removeClass() 从被选取元素删除一个或多个类名
toggleClass() 对被选元素进行添加删除类的切换操作
css()设置或返回样式属性
jQuery 尺寸方法
width()
height()获取所选元素的宽和高
innerWidht()
innerHeight()获取所选元素的宽和高(包括边距)
outerWidth()
outerHeight() 获取所选元素的宽度和高(包括被边距和边框)
outerHeight()全都都有包括外边距
遍历:
parent()直接父元素
parents()所有祖级元素
parentsUntil()返回两者之间的元素不包括他们两
children()返回他的所有子集元素
find()返回所有的子集元素及后代
siblings()返回所选元素的所有同胞元素
next()返回所选元素的下一个同胞元素
nextAll()返回所选元素下的所有同胞元素
nextUntil()返回两则之间的所有元素
prev()返回上一个同胞兄第
prevAll()返回它的所有上级同胞兄弟
prevUntil()返回两个之间的同胞兄弟
first() 方法返回被选元素的首个元素。
last() 方法返回被选元素的最后一个元素。
eq() 方法返回被选元素中带有指定索引号的元素
filter() 方法允许您规定一个标准。不匹配这个标准的元素会被从集合中删除,匹配的元素会被返回
not() 方法返回不匹配标准的所有元素。



 

以上是关于jQuery的主要内容,如果未能解决你的问题,请参考以下文章

markdown 在WordPress中使用jQuery代码片段

使用 NodeJS 和 JSDOM/jQuery 从代码片段构建 PHP 页面

很实用的JQuery代码片段(转)

几个有用的JavaScript/jQuery代码片段(转)

几个非常实用的JQuery代码片段

高效Web开发的10个jQuery代码片段