②、jQuery，Hold on!

《一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码》，点击传送门，即可获取！

$(“ol”).append(li);

// 没有用，动态创建的元素没有办法绑定事件

// on可以给未来动态创建的元素绑定事件

$(“ol”).on(“click”,“li”,function(){

alert(11);

})

var li = $(“

• 我是后来创建的
• ”)

  $(“ol”).append(li);
• 我们都是好孩子
• 我们都是好孩子
• 我们都是好孩子
• 我们都是好孩子
• 我们都是好孩子
• 1.2.2、事件处理 off()解绑事件🔥

  • off() 方法可以移除通过on()方法添加的事件处理程序。

  $(“div”).off(); // 这个是接除了div身上的所有事件

  $(“div”).off(“click”); //这个是解除了div身上的点击事件

  $(“ul”).off(“click”,“li”); //这个是解绑事件委托

  • 如果有些事件只想执行一次就不再执行，可以使用one() 方法

  $(“p”).one(“click”,function(){

  alert(11);

  })
• 我们都是好孩子
• 我们都是好孩子
• 我们都是好孩子

• 我是屁

  1.2.3、自动触发事件trigger()🔥

  有些事件希望自动触发, 比如轮播图自动播放功能跟点击右侧按钮一致。可以利用定时器自动触发右侧按钮点击事件，不必鼠标点击触发。

  // 1.元素.事件()

  $(“div”).click();

  // 2.元素.trigger(“事件”)

  $(“div”).trigger(“click”);

  // 3.元素.triggerHandler(“事件”) 不会触发元素的默认行为

  $(“div”).triggerHandler(“click”);

  • triggerHandler 模式不会触发元素的默认行为，这是和前面两种的区别。

  1.3、jQuery事件对象🔥

  ---

  事件被触发，就会有事件对象的产生

  element.on(events,[selector],function(event){})

  • 阻止默认行为: event.preventDefault() 或者 return false

  • 阻止冒泡 : event.stopPropagation()

  2、jQuery其他方法🔥

  ================================================================================

  2.1、jQuery对象拷贝🔥

  ---

  如果想要把某个对象拷贝(合并)给另外一个对象使用，此时可以使用$.extend()方法

  $.extend([deep],target,object1,[objectN])

  • deep:如果设为true为深拷贝，默认为false 浅拷贝

  • target: 要拷贝的目标对象

  • object1:待拷贝到第一个对象的对象

  • objectN:待拷贝的第N个对象的对象

  • 浅拷贝是把被拷贝的对象复杂数据类型中的地址拷贝给目标对象，修改目标对象会影响被拷贝对象

  • 深拷贝，前面加true，完全克隆(拷贝的对象，而不是地址),修改目标对象不会影响被拷贝对象

  • 深拷贝把里面的数据完全复制一份给目标对象，如果里面有不冲突的属性，会合并到一起

  $(function(){

  var targetObj = {};

  var obj = {

  id: 1,

  name: “andy”

  };

  // $.extend(target,obj);

  $.extend(targetObj,obj); // 会覆盖targetObj里面原来的数据

  // 把 obj 拷贝给 targetObj

  })

  3、jQuery插件🔥

  ==============================================================================

  jQuery 功能比较有限，想要更复杂的特效效果，可以借助于 jQuery 插件完成。

  注意: 这些插件也是依赖于jQuery来完成的，所以必须要先引入jQuery文件，因此也称为 jQuery 插件。

  jQuery 插件常用的网站:

  1. jQuery插件库 http://www.jq22.com/ (需要登录)

  2. jQuery之家 http://www.htmleaf.com/ (不需登录，推荐)

  3.1、jQuery插件使用步骤🔥

  ---

  1. 引入相关文件(jQuery文件和插件文件)

  2. 复制相关 html，css，js(调用插件)

  3.2、瀑布流插件🔥

  ---

  1. 我们打开 jQuery 之家，选择我们需要的 jQuery 插件，直接下载插件即可(这里以瀑布流插件为例)

  

  2. 我们下载完是一个压缩包，直接解压即可

  

  3. 打开 index.html，右击检查网页源代码

  学习分享，共勉

  这里是小编拿到的学习资源，其中包括“中高级Java开发面试高频考点题笔记300道.pdf”和“Java核心知识体系笔记.pdf”文件分享，内容丰富，囊括了JVM、锁、并发、Java反射、Spring原理、微服务、Zookeeper、数据库、数据结构等大量知识点。同时还有Java进阶学习的知识笔记脑图（内含大量学习笔记）！

  资料整理不易，读者朋友可以转发分享下！

  Java核心知识体系笔记.pdf

  

  中高级Java开发面试高频考点题笔记300道.pdf

  

  架构进阶面试专题及架构学习笔记脑图

  

  Java架构进阶学习视频分享
  《一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码》，点击传送门，即可获取！
  1f1b3e8f7e0ee40.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0F1Z2Vuc3Rlcm5fUVhM,size_16,color_FFFFFF,t_70#pic_center)

  3. 打开 index.html，右击检查网页源代码

  学习分享，共勉

  这里是小编拿到的学习资源，其中包括“中高级Java开发面试高频考点题笔记300道.pdf”和“Java核心知识体系笔记.pdf”文件分享，内容丰富，囊括了JVM、锁、并发、Java反射、Spring原理、微服务、Zookeeper、数据库、数据结构等大量知识点。同时还有Java进阶学习的知识笔记脑图（内含大量学习笔记）！

  资料整理不易，读者朋友可以转发分享下！

  Java核心知识体系笔记.pdf

  [外链图片转存中…(img-2qNMhxbs-1714773441843)]

  中高级Java开发面试高频考点题笔记300道.pdf

  [外链图片转存中…(img-ynlnzCTg-1714773441844)]

  架构进阶面试专题及架构学习笔记脑图

  [外链图片转存中…(img-p5Pcyab7-1714773441844)]

  Java架构进阶学习视频分享
  《一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码》，点击传送门，即可获取！