JQuery基础小白

<script src\"JQuery存储路径\"></script>

本地引入

CDN远程引入

引入方式

测试版（未压缩版）

生产版（压缩版）

引入版本

引入jQuery库

使用jQuery函数：$/jQuery

使用jQuery对象：$xxx(执行$()得到的)

使用jQuery

jQuery简介与使用方式

HTML元素操作

CSS操作

HTML事件处理

扩展新的JQuery插件

ajax封装

jQuery的功能

param是DOM元素: 将DOM元素对象包装为jQuery对象返回 $(this)

param是标签字符串: 创建标签DOM元素对象并包装为jQuery对象返回

函数调用：$(param)

基本常用的选择器

$(\" #title\")选取id为title的元素

ID选择器

$(\"h2\" )选取所有h2元素

标签选择器

$(\" .title\")选取所有class为title的元素

类选择器

$(\"*\" )选取所有元素

*通配符

$(\

$(\"h2.title\")

selector1selector2selectorN交集选择器

基本选择器

用来查找子元素，后代元素，兄弟元素的选择器

parent  child后代选择器

parent >child子选择器

prev+next相邻元素选择器，选取紧邻prev元素之后的next元素

prev~sibings同辈元素选择器，选取prev元素之后的所有siblings元素

层次选择器

:first选取第一个元素

:last选取最后一个元素

:even选取索引是偶数的所有元素（index从0开始）

:odd选取索引是奇数的所有元素（index从0开始）

:eq(index)选取索引等于index的元素（index从0开始）

:lt(index)选取索引小于index的元素（index从0开始）

:not(selector)选取去除所有与给定选择器匹配的元素

:focus选取当前获取焦点的元素

基本过滤选择器

[attribute]选取包含给定属性的元素

[attribute=value]选取等于给定属性是某个特定值的元素

[attribute !=value]选取不等于给定属性是某个特定值的元素

[attribute^=value]选取给定属性是以某些特定值开始的元素

[attribute$=value]选取给定属性是以某些特定值结尾的元素

[attribute*=value]选取给定属性是以包含某些值的元素

[selector] [selector2] [selectorN]选取满足多个条件的复合属性的元素

属性选择器

过滤选择器

分类

选择器

使用jQuery核心函数

attr()获取属性值attr(value)修改属性值 removeAttr()删除属性

addClass()添加类样式函数 removeClass()

html()获取html+文本 val()获取表单的值

操作内部标签的属性或值

属性

css(styleName): 根据样式名得到对应的值

css(json格式): 设置多个样式

设置css样式/读取css值

CSS

append(content)/appendTo(content)向当前匹配的所有元素内部的最后插入指定内容

prepend(content)/prependTo(content)向当前匹配的所有元素内部的最前面插入指定内容

before(content)/(content)insertBefore(JQ对象)将指定内容插入到当前所有匹配元素的前面

after(content)//(content)insertAfter(JQ对象)将指定内容插入到当前所有匹配元素的后面替换节点

replaceWith(content)用指定内容替换所有匹配的标签删除节点

添加/替换元素

empty()删除所有匹配元素的子元素

remove()删除所有匹配的元素

删除元素

对标签进行增删改操作

文档

first()获取第一个元素

last()获取最后一个元素

eq(index|-index)获取下标位置元素

not(selector) 除什么之外的元素

children(): 子标签中找 find() : 后代标签中找 parent() : 父标签 parents(\"标签\"):一直查找到指定标签名的祖辈标签prev() : 获取紧邻匹配元素的前一个标签 next() : 获取紧邻匹配元素的后一个标签 siblings() : 前后所有的兄弟标签 

根据指定的规则过滤内部的标签

筛选

事件解绑： off(eventName) 

处理事件监听相关

事件

fadeIn(): 带动画的显示

fadeOut(): 带动画隐藏

fadeToggle(): 带动画切换显示/隐藏

淡入淡出: 不断改变元素的透明度来实现的

slideDown(): 带动画的展开

slideUp(): 带动画的收缩

slideToggle(): 带动画的切换展开/收缩

滑动动画

show():带动画的显示

hide():带动画的隐藏

toggle():带动画的切换显示/隐藏

显示隐藏，默认没有动画

实现一些动画效果

效果

.  属性和方法

使用jQuery对象

API帮助文档

jQuery