jq
1. 查找节点
在JQuery里面， 要查找一个节点，就是利用选择器找到该节点即可。
2. 创建节点
① 创建元素节点
② 创建文本节点
创建文本节点就是在上面的基础上添加上文本即可
③ 创建属性节点
直接在新节点里面书写属性即可，但是，需要注意在书写属性的时候，属性值使用单引号，因为外层已经使用了双引号了。
3. 插入节点
|
方法 |
描述 |
|
Append |
在内容后面插入新的节点 |
|
AppendTo |
功能和上面一样，只是顺序上的不同 |
|
Prepend |
在内容前面插入新的节点 |
|
PrependTo |
功能和上面一样，只是顺序上的不同 |
|
After |
在标签后面插入新的节点 |
|
InsertAfter |
功能和上面一样，只是顺序上的不同 |
|
Before |
在标签前面插入新的节点 |
|
InsertBefore |
功能和上面一样，只是顺序上的不同 |
Append()：在内容后面插入新的节点
效果：
AppendTo():事实上和上面的方法效果一模一样，只是顺序的不同而已
效果：
Prepend()：该方法是在内容的前面进行插入
效果：
PrependTo()方法也是和prepend方法一模一样，只是顺序上的区别
效果：
After：在标签的后面添加新的节点
效果：
InsertAfter功能和after是一样的，也就是顺序上的区别
Before：在标签的前面添加新的节点
效果：
4. 删除节点
在JQuery里面，删除节点大致有3种方法，remove(),detach(),empty()
Remove（）：从DOM中删除节点
效果：点击删除按钮后，苹果这个节点被删除掉
detach()：也是从DOM中删除节点，区别在于删除节点后再添加上，事件保留。而remove删除节点的话，是彻彻底底的删除，如果在重新添加该节点，事件不会回来。
效果：通过对比我们可以看出detach不会删除事件，而remove会将节点的事件给删除掉。
empty()：这里就是置空某一个节点
效果：可以看到，节点的内容被删除掉了
5. 复制节点
复制节点在JQuery中提供了clone()方法来复制一个节点，该方法是可以传入一个参数的，传入一个true，代表复制一个节点的时候，将上面的事件一起进行复制
效果：因为clone方法里面传入了参数true，所以事件也一并被拷贝了
6. 替换节点
替换节点对应的方法有两个：replaceWith()和replaceAll()
replaceWith()：旧节点replaceWith(新节点)
效果：点击替换按钮后第一个li标签被替换成p标签
replaceAll()
功能和上面一模一样，只是顺序上的不同
语法：新节点replaceAll(旧节点)
7. 包裹节点
所谓包裹节点，就是用某个节点将其他元素包裹起来。大致有3种方法：wrap(),wrapAll(),wrapInner()
wrap():用后面的元素去包裹前面的元素，如果前面的元素有多个，那么就包裹多次。
效果：
wrapAll()：也是用后面的元素去包裹前面的元素，但是如果有多个，就合并到一起进行包裹
效果：
wrapInner()
同样是用后面的元素去包裹前面的元素，但是是包裹内容
效果：
8. 属性操作
在JQuery里面，属性的获取和设置通过attr()方法，删除属性通过removeAttr()
① 获取元素的属性
② 设置元素的属性
同样是使用attr()方法，语法：attr(属性名，属性值)
效果：duanluo被修改为article
这里有一个问题，如果要设置多个属性值应该怎么办？
Attr({属性名：属性值，属性名：属性值，属性名：属性值})
删除属性：通过removeAttr()进行删除
9. 样式操作
① 获取和设置样式
获取和设置样式同样是通过attr来获取并进行样式的设置
② 追加样式
AddClass()用于追加新的样式
效果：点击按钮后添加相应的样式
④ 移除样式 removeClass()
效果：点击按钮移除相应的样式
通过添加样式和移除样式，我们就可以做出一个动态的效果
效果：点击添加样式按钮，字体变大，点击删除样式，字体变小。
⑤ 切换样式 toggleClass()
控制一个样式的反复添加和删除
效果：通过一个按钮就实现了上面两个按钮才能实现的功能，点击按钮一下，字体方法，再点击按钮一下，移除da这个样式，字体变小
⑥ 判断某元素是否含有某个样式
hasClass()，如果含有则返回true，如果没有则返回false
10. 设置与获取HTML和文本值
① Html()
Html（）方法类似于JavaScript里面的innerHTML属性，可以获取到元素之间的内容
② Text()
Text()方法类似于JavaScript里面的innerText属性，只能获取到元素之间的文本内容
③ Val()
类似于JavaScript里面的value属性，一般用于获取表单里面控件的值
Val()除了获取表单的值以外，还有一个妙用，设置表单控件的默认值
11. 遍历节点
① Children()方法
获取某个节点所有子节点的集合
通过children()方法只能获取子节点的集合，并不能获取后代元素的集合
② Next()方法和prev()方法
获取的是同辈的下一个节点或者上一个节点
③ Siblings()方法
获取匹配元素前后所有的同辈元素。
④ Parent()和parents()
Parent():获取匹配的父辈元素
Parent():获取匹配的所有父代元素
12. CSS DOM操作
在JQuery里面，操作样式专门提供了一个css()
① 获取css样式
② 设置css样式
和attr()类似，设置css样式还是通过css()方法
语法：css（属性名，属性值）
设置多个css样式
Css({属性名：属性值，属性名：属性值})
③ 关于宽高
JQuery里面针对宽高专门提供了width()和height()函数
Width()和height()方法除了获取，也可以设置
长度单位默认是px，如果要设置为其他单位，需要双引号引起来即可
④ Position()方法
获取距离匹配元素最近的，定了位的元素的距离
Position()方法返回的是一组值，可以通过top和left分别取到相应的值
⑤ Offset()
获取匹配元素相对于当前窗口的偏移值，同样也是获取的是一组值。
