JavaWeb(8)——前端综合案例2(节流和防抖)

目录

一、节流和防抖概念

二、实例演示

三、需要注意的


一、节流和防抖概念

JavaWeb(8)——前端综合案例2(节流和防抖)_第1张图片

JavaWeb(8)——前端综合案例2(节流和防抖)_第2张图片

JavaWeb(8)——前端综合案例2(节流和防抖)_第3张图片 JavaWeb(8)——前端综合案例2(节流和防抖)_第4张图片

JavaWeb(8)——前端综合案例2(节流和防抖)_第5张图片 

JavaWeb(8)——前端综合案例2(节流和防抖)_第6张图片

二、实例演示

Lodash 简介 | Lodash中文文档 | Lodash中文网 (lodashjs.com)

 JavaWeb(8)——前端综合案例2(节流和防抖)_第7张图片

 JavaWeb(8)——前端综合案例2(节流和防抖)_第8张图片

 





  
  
  
  Document
  



  

 JavaWeb(8)——前端综合案例2(节流和防抖)_第9张图片

 JavaWeb(8)——前端综合案例2(节流和防抖)_第10张图片

 





  
  
  
  Document
  



  

JavaWeb(8)——前端综合案例2(节流和防抖)_第11张图片





  
  
  
  
  综合案例
  



  


  
  


实现页面刷新之后还能跳转到之前看到的地方。 

JavaWeb(8)——前端综合案例2(节流和防抖)_第12张图片

三、需要注意的

        在第三个例子中,关于引入 lodash 库有两种方式,

  

  

但是却不能这样引入:

否则会出现找不到 _ 的提示报错

JavaWeb(8)——前端综合案例2(节流和防抖)_第13张图片

 主要原因是:

JavaWeb(8)——前端综合案例2(节流和防抖)_第14张图片

        使用 type="module" 的方式引入 Lodash 库要求库本身支持 ES6 模块导入语法。但是,请注意,Lodash 在 4.17.3 版本以后已经移除了对 ES6 模块的支持(参考官方文档)。因此,如果您使用的是最新版本的 Lodash,应该选择传统的 方式引入。

        总结起来,如果您不使用任何构建工具、打包工具或者模块加载器,可以直接使用 的方式引入 Lodash 库。而如果您在使用现代的项目构建工具(如Webpack、Rollup等),并进行模块化开发,则可以使用 import 语句导入 Lodash 模块。

你可能感兴趣的:(前端,前端,html5,javascript,css,css3)