[JavaScript知识库]3天jQuery总结

??????????????????????????????????????? jQuery总结

? ? ? 学习了3天的jQuery，第一天学习了jQuery的介绍、前端常用的框架、入口函数以及显示隐藏等等。我了解到了jQuery可以让dom操作起来更加方便，使用动画更加的便捷，还有很多很多丰富的插件，通过学习，我知道了前端常用的框架有4种，分别是jQuery、Vue、aeach以及angular.? 第二天学习了css选择器、类的操作。第三天学习了css获取设置属性、节点关系、prop和attr，以及他们的区别。通过这三天的jQuery学习，我发现了jQuery要比JavaScript更加的快捷方便，比如JavaScript要很多行代码的编程再jQuery只需要寥寥几行就可以搞定了。

? ?? 一、? JQuery库中的$()是什么？

? ? ? $()函数是JQuery()函数的别称。$()函数用于将任何对象包裹成JQuery对象，接着你就被允许调离定义在JQuery对象上的多个不同方法。

? ? ? 二、$(document).ready()方法和window.onload有什么区别？

? ? $(）函数写法有2种,分别为$(function(){....})和$(document).ready(function(){....})，他们的特点是可以重复执行，文档加载完就执行（比较快）。

? ? ? onlaod的写法是window.οnlοad=function（）{...}，他后面的onload会覆盖前面的，还需要等待页面所有内容加载完再执行.

? ? ? ? ? ? ? 三、? 显示与隐藏:

? ? ? ? ? show（）显示

? ? ? ? ? hide（）隐藏

? ? ? ? ? toggle（）切换显示与隐藏

? ? ? ? ? slideToggle（）滑动切换显示与隐藏

? ? ? ? ? slidedown（）滑动切换显示

? ? ? ? ? slideUp（）滑动切换隐藏

? ? ? ? ? fadeToggle（）淡入淡出

? ? ? ? ? fadain()淡入

? ? ? ? ? fadeout（）淡出

? ? ? ? ? fadeto（）设置透明度

? ? ? 四、? JQuery中的选择器。

? ? ? (1)、基本选择器：#id，.class,tag标签,*;

　　(2)、层次选择器：>直接子集 空格：后代 +：相邻兄弟

　　(3)、基本过滤器选择器：:first，:last ，:not ，:even ，:odd ，:eq ，:gt ，:lt

　　(4)、内容过滤器选择器： :contains ，:empty ，:has ，:parent

　　(5)、可见性过滤器选择器：:hidden ，:visible

? ? ? (6)、子元素过滤器选择器：:nth-child ，:first-child ，:last-child ，:only-child

? ? ? ? 五、? JQuery中Class类的操作

? ? 　 1.?? $(selector).addClass(class)：为每个匹配的元素添加指定的类名

　　? 2.? $(selector).removeClass(class)：从所有匹配的元素中删除全部或者指定的类，

? ? ? ? ? ? ? 删除class中某个值；

　　? 3.?? $(selector).toggleClass(class)：如果存在（不存在）就删除（添加）一个类

　　? 4.?? $(selector).removeAttr(class);删除class这个属性；

? ? ? ? 六、 text(）html()? var（）的区别

? ? ? 1.? text()设置或获取文本

? ? ? 2.? html()设置获取html

? ? ? 3.? var()设置获取表单的值

? ? ? ? ? 七、动画

? ? ? ? stop(true,true)停止队列动画回到动画的最终状态

? ? ? ? ? ? 八、css获取设置css

? ? ? ? 1.? .css(name)获取css属性值? .css(name,value)设置css的属性值

? ? ? ? 2.? .css({name1:value,name2:value2})设置多个css值

? ? ? ? ? 九、attr设置获取节点的属性和prop设置获取节点的属性

? ? ? ? ? 1.1? .attr（name）获取节点属性值? .attr(name,value)设置节点的属性值

? ? ? ? ? 1.2? .attr({name1:value,name2:value2})设置多个节点属性值

? ? ? ? ? 2.1? .prop（name）获取节点属性值? .prop(name,value)设置节点的属性值

? ? ? ? ? 2.2? .prop{name1:value,name2:value2})设置多个节点属性值

? ? ? ? ? 十、prop和attr区别

? ? ? ? 1.attr获取节点的最初属性.prop是获取节点的动态值

? ? ? ? 2.attr设置的属性值再dom上是可见的.prop设置的表单属性值再dom节点上不可见

? ? ? ? ? ? ? 十一、事件

? ? ? ? ? 1 click()单击

? ? ? ? ? 2 ready()准备完毕

? ? ? ? ? 3 hover()鼠标移除一次

? ? ? ? ? 4 change()当表单值发生改变

? ?? 十二、节点关系

?? ?? 1. next()下一个

? ? ? 2. prev() 上一个

? ? ? 3.find() 查找子孙节点

? ? ? 4.chilren()查找子节点

? ? ? 5.parent() 父节点

? ? ? 6.parents()查找父辈节点

? ? ? 7.siblings()兄弟节点