javascript
关注
分享
扫一扫
文章平均质量分 52
李剑一
三年成大牛
展开
-
Js全部循环方法解析
javascript中循环方法自我梳理原创 2024-03-27 14:29:38 · 296 阅读 · 0 评论 -
防抖节流插件throttle-debounce
节流（Throttle）：当事件被连续触发多次时，只有第一次触发会立即执行，后续的触发会根据设定的时间间隔进行限制。防抖（Debounce）：当事件被连续触发多次时，只有最后一次触发会生效，前面的触发将被取消。原创 2024-03-21 16:27:05 · 881 阅读 · 0 评论 -
ant-design form表单校验upload组件(附个人封装的上传组件)
ant-design中form表单校验upload组件原创 2022-07-24 21:00:30 · 3196 阅读 · 1 评论 -
js柯里化
js柯里化数据原创 2022-07-24 20:58:42 · 203 阅读 · 0 评论 -
vue-quill-editor中绑定enter快捷键失灵
问题发现使用vue-quill-editor 作为聊天工具中输入框使用，有个需求是实现动态配置 enter / ctrl + enter 实现快捷发送消息。但是在实操的过程中发现通过 addBinding 事件绑定不生效。quill.keyboard.addBinding({ key: 'enter'}, function(range, context) { console.log('发送消息');});问题解决vue-quill-editor 中因为enter和ctrl这种特殊的键盘原创 2022-04-07 22:03:20 · 1295 阅读 · 0 评论 -
vue中的可拖拽宽度div
vue中可拖拽宽度的div，横向拖动&纵向拖动原创 2022-04-06 23:23:34 · 2698 阅读 · 5 评论 -
增强粘贴quill-editor
有功夫的兄弟可以看一下我的博客 www.maple.ink粘贴图片到富文本直接拖拽图片到富文本，或者从系统中复制图片文件，在富文本中粘贴，都无法将图片放入富文本。前者会直接在浏览器中打开新窗口，后者直接无任何反应。通过安装 quill-image-extend-module 增强模块使富文本编辑器具备对图片拖拽放入富文本框的能力，但不具备复制粘贴进入富文本的功能。这里可以配合 quill-image-resize-module 模块设置图片的大小。// 引入图片增强模块import {conta原创 2022-02-19 21:39:54 · 1126 阅读 · 0 评论 -
扩展quill-editor的工具栏
有功夫的兄弟可以看看我的博客 www.maple.ink扩展自定义工具栏增加自定义的 toolbar ，在 mounted 方法中监听DOM节点创建，向内插入图标/文字，即可展示出来。在 handler 对象中增加对上方自定义 toolbar 的监听，触发方法。// 首先在 toolbar 中增加相应的参数，这时在页面中相应的 DOM 结构其实已经创建完成了editorOptions: { modules: { toolbar: { contain原创 2022-02-19 21:37:36 · 1154 阅读 · 0 评论 -
使用vue-qill-editor
有功夫的兄弟可以看看我的博客 www.maple.ink安装&挂载在非Vue项目中可以通过 CDN 的方式引入，但是在Vue项目中更推荐使用 npm 安装的方式进行使用。不甚清楚的地方大家可以查阅翻译的官方文档。npm i vue-quill-editor安装成功后可以选择全局挂载富文本编辑器/组件内挂载两种方式// main.js --- 全局挂载富文本编辑器import VueQuillEditor from 'vue-quill-editor';// 引入相应的css样式原创 2022-02-19 21:35:06 · 611 阅读 · 0 评论 -
键盘按键Code值
字母键按键键码按键键码A65N78B66O79C67P80D68Q81E69R82F70S83G71T84H72U85I73V86J74W87K75X88L76Y89M77Z90数字键按键键码按键键码048553149654250755原创 2022-02-19 21:31:08 · 2751 阅读 · 0 评论 -
hexo搭建博客
hexo简介Hexo 是一个快速、简洁且高效的静态博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，通过框架生成静态HTML文件，通过打包形成一个完整的静态博客项目。hexo搭建安装Nodejs需要先行安装 Node.js (版本不能低于10.13，推荐使用12.0以上版本)Hexo版本最低兼容Nodejs版本6.0+12.13.05.0+10.13.04.1 - 4.28.104.08.63.3 - 3.96.93.原创 2022-02-19 21:30:06 · 462 阅读 · 0 评论 -
基于js-xlsx插件的echarts账单分析系统
基于js-xlsx插件的echarts账单分析系统主程序：（注释比较详细，就不再说明了）$(function() { // 头部彩蛋 // console.log(document.getElementById("demo")); // console.log($("#demo")[0].outerHTML); $(".header_title_one")[0].click(funct...原创 2020-05-01 21:46:18 · 581 阅读 · 0 评论 -
js验证码输入数字自动跳格
使用Js进行验证码输入自动跳格HTML部分：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="css/index.css" /> <scrip...原创 2020-02-06 17:36:24 · 1216 阅读 · 0 评论 -
JavaScript高级程序设计(反刍)14
第16章：跨文档消息传送，简称为XDM，核心是使用postMessage( )方法，接收两个参数：消息，消息接收方来自哪个域的字符串，第二个参数主要是为了保障传输的安全性。拖放事件：首先启用的是被拖放元素身上的事件，依次为: dragstart、drag、dragend，触发的顺序也是如此。三种方式具体表现在标签身上就是ondragstart( )，ondrag( )，ondragend( ...原创 2019-09-03 09:25:44 · 204 阅读 · 0 评论 -
ES6入门1
ES6标准是在2015.6发行的，实际名称为：ECMAScript2015版本ES5中出现了严格模式，直接设置 ’use strict’ 即可，但是ES6中当出现默认值，解构赋值，扩展运算符时函数内部不能显示设置为严格模式。ES6中新增的let声明变量，用法类似于var，但是不同于var的是let声明变量会自动创建一个作用域，且不会出现类似于var的变量提升的情况。尤其适合for循环等使用一...原创 2019-09-02 10:20:30 · 271 阅读 · 0 评论 -
纯前端实现一个密码本H5App
纯前端实现一个密码本H5App。开发工具：Hbuilder X开发语言：HTML、CSS、JavaScript项目需求：一个纯前端的密码本App，需要实现完整的增删改查操作。页面主页(index.html)实现一个三段式的布局，期间分别为“银行卡、工作账号、游戏账号”三大类，每个类别点击进入后呈现出一个流式布局的按钮，每个按钮对应自己的账号。点击跳转后，进入密码查看阶段。密码查看的页面统一...原创 2019-06-11 15:12:29 · 845 阅读 · 0 评论 -
JavaScript高级程序设计(反刍)1
好久没有看一遍前端的东西了，临近毕业了，虽然事儿很多，每天晚上多学会儿习也让心里也感觉有了一点儿踏实感，最近更新的就是每天看的《JavaScript高级程序设计》这本书的笔记，以及一些个人心得。这本书也是被搞前端的兄弟们奉为《圣经》的一本前端书籍，希望有想要入前端的同学都能看看！第一章：简史：JavaScript诞生于1995年，由Netscape公司开发，最早的功能是进行本地数据验证，避免频...原创 2019-04-11 12:33:52 · 279 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 2
第四章：基本数据类型：undefined、null、boolean、number、string引用类型的值是保存在内存中的对象，JavaScript不允许直接访问内存中的位置基本类型和引用类型值的方式不同，只能给引用类型的值添加属性：var person = new Object();person.name = “abc”;console.log(person.name); //a...原创 2019-04-12 14:05:43 · 251 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 4
第六章（上）：对象是一种无序属性的集合，其属性值可以包含基本值、对象、函数。对象的属性/方法都存在名字，而这个名字每一个都映射一个值，这个值可以是数据，也可以是函数。对象字面量是创建对象的首选方式，这样显得更具有封装性属性：(个人感觉不是很重要，只是为了增强对于属性的理解添加的)ECMAScript中的属性分两种：数据属性、访问器属性数据属性：[[Configurable]]：表示能...原创 2019-04-16 11:49:34 · 744 阅读 · 0 评论 -
JavaScript高级程序设计(反刍)3
JavaScript不具备传统面向对象的编程语言中所支持的类和接口等基本结构，所以用类的概念描述一个引用类型不是特别的精确！定义对象的方法：使用new操作符跟Object构造函数使用对象字面量的方法(因为属于连续定义，所以内部使用逗号分隔)访问对象的属性可以使用点表示法，也可以使用方括号表示法。这里方括号表示法的优点是可以通过变量来访问属性，但是日常还是以点表示法为主。Array类...原创 2019-04-13 14:05:25 · 253 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 5
第六章（下）：继承：许多OO语言都支持两种继承方式：接口继承和实现继承。接口继承只继承方法签名，实现继承则继承实际的方法。接口继承就是仅继承一个方法名，直接调用，但是方法并不归属于继承的函数实现继承则是继承了实际的方法，也就是将继承来的方法直接copy到继承函数身上1.原型链继承：原型链的基本思想就是通过原型的方式实现一种特殊的继承的方法，核心的写法就是让一个函数的原型去取得另一个函数...原创 2019-04-17 11:33:02 · 263 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 6
第七章：在前面已经介绍过了定义函数的两种方式：函数声明、函数表达式函数声明定义函数的写法存在一个重要的特征就是“函数声明提升”，在执行脚本之前，编译器会先通读一遍脚本，发现函数声明则自动将其提升到脚本的最顶端，优先解析。这也是为什么可以将函数声明放在函数调用之后的原因。函数表达式的写法则不同，函数表达式本质上并非是创建函数，而是创建了一个变量，变量的赋值使用的是函数。这种赋值式的创建方法创建...原创 2019-04-17 18:56:57 · 301 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 8
第9章：最常用的检测方法是能力检测，这种检测方式识别的并非是浏览器，而是浏览器的能力，也就是支持的方法。function isHostMethod(object, property){ var t = typeof object[property]; return t == 'function' || (!!(t == 'object' && object[pr...原创 2019-04-27 11:49:26 · 260 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 9
第10章：DOM是针对HTML和XML文档的一个API接口，关于DOM的内容在上一本书《JavaScript DOM编程艺术》中有了大体的描述，本章主要补充在上书中不存在的内容。（注意：在IE中所有的DOM对象都是通过COM对象的形式实现的，这里单指IE8之前）节点之间的关系：操作节点：增加节点：appendChild() 添加一个末尾子节点InsertBefore() 添加一个节点...原创 2019-04-27 18:55:47 · 271 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 10
第11章：DOM作为ECMAScript中API的扩展存在于JavaScript中，但是很多的DOM操作方法并未写入标准，而是很多的浏览器各自为战，所以使用DOM的时候需要注意其使用范围。选择符API：QuerySelector()方法，接收一个标准的CSS选择符，返回与该模式匹配的第一个元素。也就是通过tagName/className/idName获取到一个元素，这里需要注意的是该方法仅...原创 2019-04-28 15:18:57 · 248 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 11
第12章：DOM2和DOM3是对DOM1的升级版本，主要的升级项在于对DOM1中方法的整合，集成了很多的方法，不必再使用DOM1中繁杂的写法，但是需要注意的是部分浏览器不支持DOM2或DOM3的某些方法/属性。判断浏览器是否支持DOM2或DOM3的某个属性，使用var a = document.implementation.hasFeature(“方法/属性”, “2.0/3.0”);使用...原创 2019-05-05 17:07:44 · 239 阅读 · 0 评论 -
JavaScript高级程序设计(反刍)7
第八章：BOM (Browser Object Model) 操作，也就是浏览器对象模型，核心对象是window，window对象既是JavaScript访问浏览器的一个接口，又是ECMAScript上的Global对象。(大型项目的开发过程中，及其不建议使用BOM操作方法，浏览器市场比较繁杂，所以直接操作浏览器的方法会带来很大的隐患 )全局作用域中声明的所有变量和函数都是window对象的...原创 2019-04-25 11:52:38 · 253 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 13
第14章：在HTML中表达是< form >标签组成的，在JavaScript中，表单对应的则是HTMLFormElement类型，该类型继承的是HTMLElement类型。提交表单使用submit按钮，使用input / button都可以设置提交按钮，使用特殊的preventDefault()方法可以阻止表单的提交（这里需要注意，很多时候表单的提交只能使用一次，因为当网速有问...原创 2019-05-19 10:50:38 · 280 阅读 · 0 评论 -
JavaScript高级程序设计(反刍) 12
第13章：事件流就是从页面接收事件的顺序。IE采用的是冒泡流，也就是从该元素依次向上响应事件，而Netscape采用的是事件捕获流，也就是从上向下响应事件。DOM2中规定事件流包含三个阶段：1.事件捕获阶段2.处于目标阶段3.事件冒泡阶段事件处理程序事件就是用户或者浏览器自身执行的某种动作，而响应某个事件的函数叫做事件处理程序。所有的事件处理程序都是以on开头。HTMl事件处理...原创 2019-05-10 11:54:09 · 300 阅读 · 0 评论 -
关于JavaScript DOM 编程艺术这本书
刚刚看完这本《JavaScript DOM 编程艺术》寻思写点儿东西，给想要购买的小伙伴们一些建议！这本书适合刚刚入门DOM操作的人，是一本比较详细和基础的入门书。自己看完感觉还是不错的，但是这本书的出版时间较早，所以看的时候需要注意！原创 2019-04-10 14:08:43 · 4493 阅读 · 1 评论