首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

使用webpack打包js文件(隔行变色案例)

使用webpack打包js文件(隔行变色案例) 1.webpack安装的两种方式 运行npm i webpack -g全局安装webpack,这样就能在全局使用webpack的命令 在项目根目录中运行npm...i webpack --save-dev安装到项目依赖中 2.初步使用webpack打包构建列表隔行变色案例 项目结构: ?...image 运行npm init -y初始化项目,使用npm管理项目中的依赖包 创建项目基本的目录结构 使用npm i jquery -s安装jquery类库 创建main.js并书写隔行变色的代码逻辑...('li:even').css('background-color',function () { return '#'+'F15A24' }) }) 直接在页面上引用main.js...main.js进行处理: webpack src/js/main.js -o dist/bundle.js 注意如果提示没有webpack-cli,安装: npm install webpack-cli

2.5K20

JavaScript 技巧篇-js增加延迟时间解决单击双击事件冲突,双击事件触发单击事件

js 的单双击事件同时存在会有一个问题:双击事件会同时触发单击事件,两个事件存在冲突。 我们加一个延迟时间就能很好的解决这个问题。...原理: 当接收到第一个点击时,我们先把单击事件存储在这个是全局变量 click_store 里,如果 0.3 秒内没有接收到双击事件,就去执行它,如果接收到了,我们把它清理掉,然后去执行双击事件。...var click_store // 定义一个全局变量存储单击触发事件 document.addEventListener('click', deal_click); document.addEventListener...('dblclick', deal_dblclick); function deal_click(e){ click_store = setTimeout(function(e){ // 单击触发事件...,0.3s延迟 ... },300); } function deal_dblclick(e){ // 单击事件清理 clearTimeout(click_store); // 双击触发事件

6K30

轻听变色之谜

那么轻听是如何实现变色的呢? 主要是结合以下两种方式: 自定义Style和Theme 动态配置主题色 自定义Style和Theme Style和Theme主要用来实现白天模式和夜间模式。...其中DefaultProcessor是默认Processor,可以处理绝大部分的变色情况。其他几种,如他们的名字一样,会额外再处理他们特定的情况。...结语 以上,就是两种变色方案的具体实现。 自定义Style和Theme实现简单,整洁,适用于模式较为固定的场景。 动态配置主题色实现起来略微复杂,但是比较灵活,适用于主题色较多的场景。...将这两种方案结合,就实现了轻听的变色。 大家轻拍,如果有好的方法或者建议,可以多多讨论交流优化~

1.8K00

js关键词变色,数组打乱,数组去重的实现和封装

1.前言 今天,把自己之前封装过的一部分小功能操作分享出现,都是一些可以说是比较常用,实现起来比较简单,代码又比较少的一些功能或操作,比如关键词变色,数组打乱,数组去重等。...2.关键词变色 这个功能很常见,特别是在搜索引擎执行搜索的时候。其它不多说了,直接上代码 关键词变色 span...大家都看到了吧,我只输入‘过来’,结果‘前端’也变色了,那是因为我输入‘过来’的时候,之前就输入过‘前端’运行了一次,下一次不清除就会有这个bug,清除了就没事了!...后续 关于js是实用或者常用的小功能操作,今天先到这里,以后再写其它的,希望能帮到大家!

1.4K21
领券