[JavaScript知识库]JQuery部分知识点

知识点1：jQuery

? 1.减少了原生中对dom操作时 需要去大量记忆 $、query

? 2.jquery累积了大量的插件库,极大的简化了项目的开发

? 3.jquery更新到了3.xx pc：1.xx 移动端：2.xx 1.13.1

知识点2：$符号

jQuery把所有功能全部封装在一个全局变量jQuery中，用$这个合法变量名作为别名，而$本质是一个函数（函数也是对象）。

基础语法是：$(selector).action()，即选择符查找HTML元素然后执行操作。

知识点3：选择器

? 1.按ID查找：例：var div = $('#abc');

? 2.按元素查找：例：var ps = $('p');

? 3.按class查找：例：var a = $('.red');

? 4.按属性查找：例：var email = $('[name=email]');

? 5.层级选择器，层级间用空格隔开，先定位了父节点再选择相应子节点：例：$('form.test p input');

? 6.子选择器，限定了层级关系必须是父子关系，即直属子节点：例：$('ul.lang>li.lang-javascript');

...

知识点4：查找与过滤

也可以在拿到jQuery对象后以其为基准进行查找或过滤。

? 1.find()根据参数在其所有子节点中查找；

? 2.children()返回所有直接子元素；

? 3.parent()返回直接父元素，parents()返回所有祖先元素，一直向上到根元素；

? 4.next()返回下一个同胞元素，nextAll()返回所有跟随的同胞元素；

? 5.prev()和prevAll()则与之反向；

? 6.siblings()返回所有同胞元素；

? 7.first()和last()分别返回被选集合中首个和最后一个元素；

知识点5：DOM

一个jQuery对象可以包含0个或任意个DOM对象，它的方法会作用在每个DOM节点上。即使选择器没有返回任何节点，调用方法也不会报错。

jQuery的API设计非常巧妙，很多方法无参数调用是获取值，传入参数变成设置值。另外jQuery对象的所有方法都返回一个jQuery对象，因此可以进行链式调用。

知识点6：事件

1.添加事件：

例：a.click(function () {

alert('Hello!');

});

2.移除事件：

例：a.off('click', fun);

3.常见事件：

click: 鼠标单击； dblclick：鼠标双击； mouseenter：鼠标进入； mouseleave：鼠标移出； mousemove：鼠标在DOM内部移动； hover：鼠标进入和退出。

keydown：键盘按下； keyup：键盘松开； keypress：按一次键。

focus：获得焦点； blur：失去焦点； change：内容改变； submit：表单提交。