![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JAVASCRIPT
玫瑰花开一片一片
这个作者很懒,什么都没留下…
展开
-
吸管工具,canvas模拟吸管工具,吸取图片中的颜色值 vue.js 颜色值 转换
【代码】吸管工具,canvas模拟吸管工具,吸取图片中的颜色值 vue.js 颜色值 转换。原创 2023-02-14 15:39:25 · 812 阅读 · 1 评论 -
前端js、javascript 鼠标 框选 文件 功能
【代码】前端js、javascript 鼠标 框选 文件 功能。原创 2023-02-10 16:25:22 · 747 阅读 · 0 评论 -
如何在点击外部按钮时让输入框不失去焦点不失去选择焦点
一.点击其他区域,input输入框不失去焦点。原创 2022-10-07 16:58:17 · 2399 阅读 · 0 评论 -
handsontable 给单元格设置下拉 菜单
handsontable 可以扩展 render 和编辑功能,当然自己扩展还是很麻烦的。按照官方的例子会出现 一列都有同样的下拉菜单数据。并且右键菜单也不可以向右/左添加列。我们可以通过 加个右键菜单,动态给某个单元格添加 上述的各种类型 包括 下拉菜单。例子都是以 hotSettings -> columns 进行展示的。这样就可以 进行扩展了 ,例如增加个弹窗动态增加 下拉菜单内容。而我们的需求是 针对某个单元格进行 单独单独设置下拉菜单。默认给了这么几种单元格类型。原创 2022-09-29 16:07:10 · 1791 阅读 · 0 评论 -
前端JS 图片裁剪,Canvas,原生方法
【代码】前端JS 图片裁剪,Canvas,原生方法。原创 2022-09-23 15:21:04 · 340 阅读 · 0 评论 -
console.log 样式修改
console.log 样式修改原创 2022-06-17 16:42:06 · 322 阅读 · 0 评论 -
js 取两个数字的中间数
var s = 21;var t = 8;var m = (s & t) + ((s ^ t) >> 1);console.log("num",m); //输出:m=14原创 2022-04-25 16:42:27 · 1488 阅读 · 0 评论 -
如何发布自己的npm 包
npm 包发布原创 2021-11-26 09:17:39 · 523 阅读 · 0 评论 -
过滤 区域间数据
data: testList: [ { line: 0, len: 15, from: 1, to: 15 }, { line: 1, len: 16, from: 16, to: 31 }, { line: 2, len: 6, from: 32, to: 37 }, { line: 3, len: 24, from: 38, to: 61 }, { line: 4, len: 72, from: 62, to: 13.原创 2021-01-31 16:54:09 · 111 阅读 · 0 评论 -
自适应浏览器宽度陈列 组件 - vue 可配置不同分辨率 显示列数
组件使用预览:<template> <display-content :column="{ '500': 3, '1000': 5, '1400': 8 }"> <display-item v-for="item in 20" :key="item" class="loops"> 自定义内容区域 {{item}} </display-item> </display-content>&l原创 2021-01-26 16:37:20 · 668 阅读 · 0 评论 -
vue - codemirror 点击对应标签查找 结束标签 位置
template :<codemirror :value="code" @cursorActivity="cursorActivity"></codemirror>import:import CodeMirror from 'codemirror/lib/codemirror'methods: cursorActivity (cm) { let cur = cm.getCursor() let range = cm.ge...原创 2021-01-26 16:12:29 · 796 阅读 · 0 评论 -
页面禁止刷新、回退、右键菜单禁用
document.onkeydown=function(e){e=window.event||e;vark=e.keyCode;//屏蔽ctrl+R,F5键,ctrl+F5键F3键!验证if((e.ctrlKey==true&&k==82)||(k==116)||(e.ctrlKey==true&&k==116)||k==114){e.key...原创 2020-11-23 08:32:17 · 203 阅读 · 0 评论 -
用js 设置网页快捷键
document.onkeydown = onKeyDown let that = this // 快捷键 function onKeyDown () { if ('router-path' === optionName) { if (window.event.ctrlKey && window.event.shiftKey && (window.event.keyCode == 71)) { that.原创 2020-08-05 16:20:10 · 753 阅读 · 0 评论 -
ECMAScript 提案阶段
stage0 strawman任何讨论、想法、改变或者还没加到提案的特性都在这个阶段。只有TC39成员可以提交。stage1 proposal(1)产出一个正式的提案。 (2)发现潜在的问题,例如与其他特性的关系,实现难题。 (3)提案包括详细的API描述,使用例子,以及关于相关的语义和算法。stage2 draft(1)提供一个初始的草案规范,与最终标准中包含的特性不会有太大差别。...原创 2020-04-30 15:18:13 · 304 阅读 · 0 评论 -
vue 在 任意方法中 自定义 创建一个render 方法
示例:<template> <div> <div v-html="customRender()"></div> <!-- <div>自定义</div> --> </div></template>methods: { customRender (...原创 2020-04-28 16:36:40 · 1231 阅读 · 1 评论 -
监听页面关闭 或者 F5 刷新
window.addEventListener('beforeunload', e => { console.log('窗口即将关闭!') })原创 2020-04-22 15:10:52 · 1731 阅读 · 0 评论 -
window.open() 弹出窗口参数, 对弹出窗口的操作
// 使用方法window.open('http://www.baidu.com', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no')// 各参数'httP://www....原创 2020-04-22 15:08:18 · 408 阅读 · 0 评论 -
JS 禁止页面刷新 右键 或 F5
// 禁止f5刷新document.onkeydown = function (e) { let ev = window.event || e let code = ev.keyCode || ev.which if (code == 116) { ev.keyCode ? ev.keyCode = 0 : ev.which = 0 ca...原创 2020-04-22 15:04:29 · 240 阅读 · 0 评论 -
JS兼容所有浏览器获取浏览器高度和宽度/ 各种宽高代表意思/ 监听窗口变化
监听窗口变化// 监听窗口变化 window.addEventListener('resize', () => { this.clientHeight = document.documentElement.clientHeight || document.body.clientHeight; })获取浏览器宽高(兼容)var w = wi...原创 2020-03-26 16:10:17 · 353 阅读 · 0 评论 -
js中的各种“位置”——“top、clientTop、scrollTop、offsetTop……
============================分割线======================================offsetParent:该属性返回一个对象的引用,这个对象是距离调用offsetParent的元素最近的(在包含层次中最靠近的),已进行过CSS定位的容器元素。 如果这个容器元素未进行CSS定位, 则offsetParent属性的取值为bo...转载 2020-03-26 16:06:31 · 1412 阅读 · 0 评论 -
数组 filter、some、map、foreach 方法的作用
ECMAScript5为数组定义了5个迭代方法。every()、filter()、forEach()、map()、some()。这5个方法都接收两个参数:运行的函数和运行该函数的作用域对象this的值。循环(loop),指的是在满足条件的情况下,重复执行同一段代码。比如,while语句。迭代(iterate),指的是按照某种顺序逐个访问列表中的每一项。比如,for语句。遍历(trave...原创 2020-03-24 15:49:28 · 158 阅读 · 0 评论 -
JS 判断数组里的 数据 | 内容 是否相同 相等
1. 遍历 方法let arr = ['success', 'success', 'success', 'error', 'success' ]isEqual (arr = []) { let flag = true arr.forEach((element, index) => { let nextIndex = index + 1 let next...原创 2020-03-24 15:08:21 · 6105 阅读 · 1 评论 -
js 数组去重 以及 数组中得对象去重方法
1.数组去重let arr = [1, 1, 1, 2, 2, 4, 4, 5]let endArr = [...new Set(arr)]endArr // [1, 2, 4, 5]2. 数组中的对象去重let removeDuplicateObject = (arr) => { let temp = arr.map(item => JSON.stri...原创 2020-03-24 13:01:37 · 150 阅读 · 0 评论 -
js 中 拷贝对象原生方法 Object.assign({}, this.data)
(以下场景 vue开发)js中 对象复制 并不是拷贝新对象 而是 把同一个内存地址 指向不同的变量!这样在日常开发中提供了 很大的便利! 但在某些场景下 就变成了 BUG目前我 常用方法 有两种1. 用以下方法 转一次 再重新赋值 便可以脱离 内存地址的绑定 也就是克隆了一个新的对象,但有个问题 对象长度 过大,或一些不明原因 会导致 转换报错JSON.strin...原创 2020-03-02 09:02:40 · 1687 阅读 · 0 评论 -
vue 模拟鼠标右键菜单
1. 安装插件github地址 https://github.com/ShengChangWei/e-vue-contextmenunpm ie-vue-contextmenu2. 在main.js 中全局 注册组件, (也可以局部注册)import EVueContextmenu from 'e-vue-contextmenu'Vue.use(EVueContext...原创 2020-02-26 14:36:49 · 1134 阅读 · 0 评论 -
vue render 函数 如和创建 html 注释节点, 如何创建文本节点
最近在研究一个自动化项目, 让使用者可以直接编辑网页上得模块 (用 Vue 写的)项目业务1.首先 从数据库 获取 head 和 body 的innerHTML 文本2.然后用 递归 循环 head ,body 的所有节点 其中包括 注释节点, 转换成 render 函数节点 (期间添加N多个自动化方法),这样就可以在vue 中渲染页面实现想要 自动化的功能render 函数参数...原创 2020-01-22 14:01:23 · 2282 阅读 · 0 评论 -
js 中 Proxy get()使用方法, 以及内置各种方法
Proxy 中 有指定方法例如:get() //方法用于拦截对象的读取属性操作。set()// 方法用于 拦截对象 设置属性操作has() //方法是针对in操作符的代理方法。apply() //方法用于拦截函数的调用construct() //方法用于拦截new操作符,为可使new操作符在生成的Proxy对象上生效,用于初始化代理的目标对象自身必须具有...原创 2020-01-17 16:33:55 · 3758 阅读 · 0 评论 -
js查找 对象,json 中的值是否存在 ,深层查找,并返回该参数 (ES5语法)
测试数据:let obj = { name: 'lee', info: { age: '18', set: [0, { aa: 'zz' }, 2] } }方法:// 方法function getter(obj, arr) { return arr.length === 0 ? obj : getter(typeof obj === 'undefined' ? unde...原创 2020-01-17 13:39:41 · 1833 阅读 · 0 评论 -
mapState 用法
store代码:import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)const store = new Vuex.Store({ state: { count: 0 }, mutations: { increment (state) { state.count++ } }...原创 2020-01-14 17:03:30 · 835 阅读 · 0 评论 -
拆分数组 形成二维数组
拆分数组let setChunk = function (Arr, num){ class Chunk { constructor (list, num) { this.list = list || [] this.num = num || 2 this.end = [] } ...原创 2020-01-14 15:23:12 · 394 阅读 · 0 评论 -
tab 标签切换 原生JS, ES6 类 封装 有基础css 效果
上代码 :<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-eq...原创 2020-01-10 15:37:08 · 292 阅读 · 0 评论 -
CSS3 加 javascript 滚动轮播图
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Com...原创 2020-01-07 16:02:28 · 227 阅读 · 0 评论 -
es6中 数组的flat() 与 flatMap() ,map() 使用方法
把嵌套数组拉平,该方法返回一个新数组,对原数据没有影响。[1, 2, [3, 4]].flat()// [1, 2, 3, 4]flat(num) 需要拉平几层 数组,按顺序排列, 默认 是 1[1, 2, [3, [4, 5]]].flat()// [1, 2, 3, [4, 5]][1, 2, [3, [4, 5]]].flat(2)// [1, 2, 3, 4, 5...原创 2020-01-02 15:31:20 · 1328 阅读 · 0 评论 -
JS中Map的用法
JS中Map的用法var map = new Map();设值map.set("key","value");取值map.get("key");判断key是否存在map.has("key"); 删除keymap.delete("key");原创 2020-01-02 15:24:26 · 620 阅读 · 0 评论 -
多维数组,以及 业务中 递增数据计算!使用map方法 可以快速计算
在日常开发中 可能遇到 一些让人很头疼的 递增数据 ,逻辑很清晰, 但代码写起来 就很复杂!~之前Vue (iview UI) 写过一个 购物网站的后台管理项目,里面有一个 型号递增规则 动态生成 表格数据!写的我脑子都要炸了(怪我太菜了!)1. iview table表格 将来要接的数据格式是 (最终UI 上需要同型号合并表格,忽略) : (这里我只写到了二级内容 业...原创 2020-01-02 10:47:06 · 557 阅读 · 1 评论 -
javascript 》 什么是面向对象?原型继承? 面试题
1.面向对象面向对象是一种编程思想,JS本身就是基于面向对象构建出来的(例如:JS 种有很多的内置类,像Promise 就是ES6种新增的一个内置类,我们可以基于new Promise 来创建一个实例,来管理异步编程。。。)像vue,Jquery 也都是 基于面向对象构建出来的。js 中的面向对象, 和其它编程语言略有不同, js中的类和实例是基于原型和原型链机制来处理的; 而且js中关...原创 2019-12-30 10:30:21 · 378 阅读 · 0 评论 -
网页按照比例缩放 适配 移动端
例子<!DOCTYPE html><html><head> <title>网页按照比例缩放</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> <style ty...转载 2019-11-29 11:30:19 · 770 阅读 · 0 评论 -
判断两个时间段是否相差 几 个月
//比较两个时间 time1,time2均为日期类型 //判断两个时间段是否相差 m 个月function completeDate(time1 , time2 , m){ var diffyear = time2.getFullYear() - time1.getFullYear() ; var diffmonth = diffyear * 12 + time2.ge...转载 2019-11-20 18:36:37 · 3208 阅读 · 0 评论 -
构造函数 与 原型 与实例化对象 的关系!
创建一个构造函数每个函数里都有一个原型对象, 原型对象内的constructor 又是函数本身function per3(name) { this.name = name this.fn = function (){ console.log(this.name) console.log('我是构造函数') }}给构造函数的原型对象添加方法...原创 2019-10-18 15:40:39 · 327 阅读 · 0 评论 -
web请求的状态码 含义
http状态返回代码 1xx(临时响应)表示临时响应并需要请求者继续执行操作的状态代码。http状态返回代码代码 说明100 (继续) 请求者应当继续提出请求。 服务器返回此代码表示已收到请求的第一部分,正在等待其余部分。101 (切换协议) 请求者已要求服务器切换协议,服务器已确认并准备切换。http状态返回代码2xx (成功)表示成功处理了请求的状态代码。...原创 2019-10-12 15:52:07 · 581 阅读 · 0 评论