Auto-update blog content

Author: github-actions[bot]

content/posts/2024-05-01-138364132.md

@@ -0,0 +1,250 @@
+---
+layout: post
+title: "jQuery简单总结归纳"
+date: 2024-05-01T05:40:58+0800
+description: "remove([expr])\t\t\ta.remove(b)所有的a，是b的话就会删除\ta.remove()删除a。replaceWith(content|fn)a.replaceWith(b)用b替换所有的a。replaceAll(selector)\ta.replaceAll(b)\t用a替换所有的b。empty()\t\t\t\ta.empty()把a掏空，把a里面的所有元素都删除。"
+keywords: "【jQuery】简单总结归纳"
+categories: ['未分类']
+tags: ['前端', 'Jquery', 'Javascript']
+artid: "138364132"
+arturl: "https://blog.csdn.net/2401_84002482/article/details/138364132"
+image:
+    path: https://api.vvhan.com/api/bing?rand=sj&artid=138364132
+    alt: "jQuery简单总结归纳"
+render_with_liquid: false
+featuredImage: https://bing.ee123.net/img/rand?artid=138364132
+featuredImagePreview: https://bing.ee123.net/img/rand?artid=138364132
+cover: https://bing.ee123.net/img/rand?artid=138364132
+img: https://bing.ee123.net/img/rand?artid=138364132
+---
+
+
+
+# 【jQuery】简单总结归纳
+
+
+
+
+通过浏览器调试：
+
+![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/ca5a0cf9bfba46d8409689e4d9b13135.png#pic_center)
+
+我们通过数组可以类比出：jQuery对象其实是一个长度为4的dom对象数组
+
+button #mae01……button#mae04
+
+所以jQuery对象其实就是一个**DOM对象数组**
+
+jQuery对象本质：**DOM对象的数组**+jQuery提供的一系列函数功能
+
+**jQuery对象与js对象的转换：**
+
+jQuery->js: $(DOM对象);
+
+js->jQuery：jQuery对象[下标]
+
+通过数组下标取出dom对象
+
+**jQuery对象的迭代：**
+
+C++
+
+  
+
+Java
+
+  
+
+Python
+
+  
+
+JavaScript
+
+![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/c943b0fcd13db925f7e001f37fcbca10.png#pic_center)
+
+四、jQuery选择器
+
+---
+
+**与CSS选择器 类似**
+
+基本选择器
+
+后代选择器
+
+子选择器
+
+并集选择器
+
+伪类选择器
+
+五、jQuery元素的筛选
+
+---
+
+* eq(index):获取该index个元素（从0开始）
+
+//获取第2个p元素：
+
+Hello China
+
+`$(“p”).ep(2);
+
+`
+
+//html
+
+`<p>Hello</p><p>Hello China</p><p class="selected">Hello World</p>`
+
+* filter(exp):获取与指定exp匹配的元素
+
+//js 获取类名为select的元素:
+
+Hello World
+
+$(“p”).filter(“.selected”)`
+
+//html
+
+`<p>Hello</p><p>Hello China</p><p class="selected">Hello World</p>`
+
+* parent():得到元素的父元素
+* find(exp):返回匹配给定选择器的后代元素
+
+//从所有段落开始，进一步搜索span元素，即后代选择器
+
+$(“p”).find(“span”)
+
+HelloHello World
+
+* nextAll():返回当前元素所有兄弟元素
+* next():返回当前元素耳朵下一个兄弟元素
+
+六、jQuery属性标签
+
+---
+
+**不传参数是获取，传参数是设置**
+
+* html()：起始标签和结束标签中的内容，与DOM对象的innerHTML相同
+* txet()：起始标签和结束标签中的内容，与iDOM对象的nnerText相同
+* val()：表单项的value属性值，与DOM对象的value相同
+* attr()、prop():设置和获取属性值
+
+七、DOM的增删改
+
+---
+
+内部插入
+
+appendTo(content) a.appendTo(b); 把a加到b里面 添加到最后面
+
+prependTo(content) a.prependTo(b); 把a添加到b里面 添加到最前面
+
+外部插入
+
+insertAfter(content) a.insertAfter(b); 把a插入到b的后面
+
+insertBefore(content) a.insertBefore(b); 把a插入到b的前面
+
+替换
+
+replaceWith(content|fn) a.replaceWith(b) 用b替换所有的a
+
+replaceAll(selector) a.replaceAll(b) 用a替换所有的b
+
+删除
+
+empty() a.empty() 把a掏空，把a里面的所有元素都删除
+
+remove([expr]) a.remove(b) 所有的a，是b的话就会删除 a.remove() 删除a
+
+八、CSS样式操作
+
+---
+
+//参数可以传类名
+
+addClass(class|fn) 添加样式
+
+removeClass(class|fn) 删除样式
+
+toggleClass(class|fn) 替换样式(有就删除，没有就添加)
+
+offse(class|fn) 获取和设置元素的坐标
+
+//即给p标签添加上selected类的属性
+
+$(“p”).addClass(“selected”);
+
+九、jQuery动画
+
+---
+
+第一个参数：动画执行时间
+
+第二个参数：动画的回调函数，即动画完成后，自动调用的函数
+
+**基本动画：**
+
+show() 将隐藏元素显示
+
+hide() 将显示元素隐藏
+
+toggle() 替换
+
+**淡入淡出动画：**
+
+fadeIn() 淡入
+
+fadeout() 淡出
+
+fadeTo() 在指定时长内慢慢将透明度修改到指定值
+
+透明度：0(完全透明)-1(完全可见)
+
+fadeToggle() 淡入/淡出切换
+
+十、jQuery事件操作
+
+---
+
+**Java面试核心知识点笔记**
+
+其中囊括了JVM、锁、并发、Java反射、Spring原理、微服务、Zookeeper、数据库、数据结构等大量知识点。
+
+![蚂蚁金服（Java研发岗），26岁小伙斩获三面，收获Offer定级P6](https://i-blog.csdnimg.cn/blog_migrate/0cae468b28f80d7f084c16d4bd6aadec.png)
+
+**Java中高级面试高频考点整理**
+
+![蚂蚁金服（Java研发岗），26岁小伙斩获三面，收获Offer定级P6](https://i-blog.csdnimg.cn/blog_migrate/07cd50c4612a0b517a35873646ce2b36.png)
+
+![蚂蚁金服（Java研发岗），26岁小伙斩获三面，收获Offer定级P6](https://i-blog.csdnimg.cn/blog_migrate/7c0e4f7493b7d1d4c5cdccfd5f35d2a2.png)
+
+**最后分享Java进阶学习及面试必备的视频教学**
+
+![蚂蚁金服（Java研发岗），26岁小伙斩获三面，收获Offer定级P6](https://i-blog.csdnimg.cn/blog_migrate/754ad3a2b5b38ee59c6ba7308ca4bac5.png)
+
+---
+
+**Java面试核心知识点笔记**
+
+其中囊括了JVM、锁、并发、Java反射、Spring原理、微服务、Zookeeper、数据库、数据结构等大量知识点。
+
+[外链图片转存中…(img-EzBmFXVm-1714513240971)]
+
+**Java中高级面试高频考点整理**
+
+[外链图片转存中…(img-usV7LqYV-1714513240971)]
+
+[外链图片转存中…(img-EGywbKXK-1714513240972)]
+
+**最后分享Java进阶学习及面试必备的视频教学**
+
+[外链图片转存中…(img-HRQx1GW2-1714513240972)]
+
+> **本文已被[CODING开源项目：【一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码】](https://bbs.csdn.net/topics/618154847)收录**
+
+
+