JQuery快速查看总结

1.选择器 $()
$(‘p’)
$(‘#btn’)
$(‘.cls’)
$(‘*’)
$(this)
$(‘p.cls’)
$(‘p:first’)
$(‘ul li:first’)----第一个ul下面的第一个li
$(‘ul li:first-child’)—每个ul的第一个li
$(‘[href]’)–属性选择器
$(‘li.even’)偶数位置
$(‘li.add’)奇数位置…

2.事件
鼠标 click-dbclick-mouseenter-mouseleave-hover
键盘 keydown-keyup-keypress
表单 submit-change-focus
窗口 load-resize-scroll-unload

==效果=
3.显示/隐藏
.hide([时间],[callback])/.show()/.toggle()
-----$(selector)选中的元素的个数为n个,则callback函数会执行n次
4…淡入淡出
.fadeIn(时间)/ .fadeOut()/ .fadeToggle()/ .fadeTo(时间,透明度,[callback])
5.滑动
slideUp(时间)/slideDown()/slideToggle()
6.动画
Animate({css属性键值},[时长],[callback])
-------.animate({left:‘250px’});
-------.animate({ left:‘250px’,
opacity:‘0.5’,
height:’+=150px’, //(相对值)
width:‘150px’ });
7.链式编程
$("#p1").css(“color”,“red”).slideUp(2000).slideDown(2000);

=HTML=
8.获取内容/属性
Text()—设置或返回文本内容
Html()—设置返回文本内容,包括html标记
val()–设置或返回表单字段的值
Attr()–设置获取属性,设置多个属性时可以传入一个对象
9.添加元素(新的html元素)
Append()–追加最后一个子
Prepend()
After()–追加最后一个兄弟
Before()

10.删除元素
Remove()–删除子元素以及自己
Empty() --删除子元素
11.操作类
addClass()-------添加一个或多个类
removeClass()–删除一个或多个类
toggleClass()----切换类
12.样式css() 获取设置样式属性
$(“p”).css({“background-color”:“yellow”,“font-size”:“200%”});
13.尺寸
width() --内容宽
innerWidth()–内容+内边距
outerWidth()–内容+内边距+边框

===遍历=
14.祖先
Parent()–向上一级
Parents()–向上到根---------可以过滤$(‘span’).parents(‘div’)
parentsUntil()—介于两元素之间的所有祖先元素
15.后代
Children()–下一级 $(document).ready(function(){ $(“div”).children(“p.1”); });
—子元素中类名为1的p元素
Find()–所有子元素 $(document).ready(function(){ KaTeX parse error: Expected 'EOF', got '}' at position 20: …v").find("*"); }̲); ---所有子元素要加“*…(document).ready(function(){ $(“p”).filter(".url"); });类名为 url的p
.not()—与filter相反

=Ajax==
18.元素.load(url,[data],[callback])
19.Get()/post()
20.$ajax({type:“get/post”,url:“”,success:function(data){}})

其他
21.当 J Q u e r y 与其他框架重合,可以用全名JQuery代替简写,并且释放 ;也可以把$存入其他变量
(1)释放 n o C o n f l i c t ( ) C o n f l i c t : ( 2 ) l e t j q = noConflict()------Conflict:冲突 (2)其他变量 let jq= .noConflict();

=插件=
22.validate-----表单验证
23.Autocomplete–搜索框用于用户输入的值与预设值进行匹配
(1)http://www.runoob.com/jqueryui/example-autocomplete.html
24.密码验证–validate的拓展密码验证
25.时间–几秒前/几天前
-----https://github.com/fengyuanchen/prettydate/blob/v0.1.0/README.md
26.树形菜单插件(Treeview)

==UI
1.折叠面板
http://www.runoob.com/jqueryui/example-accordion.html
2.拖动

第一篇博客感觉可读性不高,以后要好好写写

猜你喜欢

转载自blog.csdn.net/qq_36789308/article/details/84874574