javascript
小薇安
这个作者很懒,什么都没留下…
展开
-
react中虚拟DOM,diff算法
什么是DOM:说到虚拟DOM,就要知道什么是DOM,DOM就是结构化文本抽象表达形式,特定于web中,这个结构化文本就是html文本,html中每个元素都对应DOM中某个节点,这样因为HTML元素都逐级包含关系,DOM节点自然就构成了一个树形结构,成为DOM树。浏览器为了渲染HTML格式的网页,会先将HTML文本解析以构建dom树,然后根据DOM树渲染出用户看到都界面,当要改变界面内容都时候,去改变DOM树上都节点。操作DOM缺点:在前端开发中,性能消耗最大的就是DOM操作了,而且DOM操作这部分代码原创 2020-05-12 16:40:31 · 304 阅读 · 0 评论 -
immutable的应用
既然说到immutable,那什么是immutable呢?immutable Data就是一旦被创建,就不能再被更改的数据,对immutable对象的任何修改,包括增删改查都会返回一个immutable对象,他实现的原理是Persistent Data Structure持久化数据结构,也就是使用旧数据创建新数据的时候,要保证旧数据可用且不变,同时为了避免deepCopy把所有节点都复制一遍带来的性能损耗,immutable使用了Structure Sharing(结构共享),即:如果对象数中一个节点发生原创 2020-05-11 22:52:03 · 386 阅读 · 0 评论 -
web worker介绍以及应用场景
web worker介绍以及应用场景什么是web worker ?为什么要用web worker ?怎么使用web worker ?1.主线程采用new 命令,调用worker构造函数,Worker中接收两个参数,一个url,就是worker执行计算的脚本的路径url(为必须参数),worker线程所要执行的任务,这个脚本必须来自网络,放到服务器上,如果脚本没下载成功,就会失败,第二个参数是配置对象,该对象可选。它的一个作用就是指定 Worker 的名称,用来区分多个 Worker 线程;2.javascr原创 2020-05-11 19:03:21 · 2012 阅读 · 0 评论 -
Uncaught TypeError: Cannot read property 'number' of undefined
引用以下内容时报错: Uncaught TypeError: Cannot read property ‘number’ of undefinedstatic propTypes = { value: PropTypes.number.isRequired, onIncrement: PropTypes.func.isRequired, onDecrement: Pr原创 2018-02-02 14:12:02 · 1383 阅读 · 0 评论 -
webpack使用报错
问题一: throw new Error( ^Error: original.line and original.column are not numbers -- you probably meant to omit the original mapping entirely and only map the generated position. If so, pa原创 2018-01-20 15:26:16 · 1995 阅读 · 0 评论 -
开发环境、测试环境、生产环境、UAT环境、仿真环境详解
开发环境(DEV):开发环境是程序猿们专门用于开发的服务器,配置可以比较随意, 为了开发调试方便,一般打开全部错误报告。测试环境(UAT):一般是克隆一份生产环境的配置,一个程序在测试环境工作不正常,那么肯定不能把它发布到生产机上。生产环境(PROD):是指正式提供对外服务的,一般会关掉错误报告,打开错误日志。可以理解为包含所有的功能的环境,任何项目所使用的环境都以这个为基础,然后根据客户...原创 2018-02-25 17:05:36 · 14594 阅读 · 0 评论 -
html-webpack-plugin插件
Installation 使用 npm 安装这个插件$ npm install html-webpack-plugin@2 –save-devBasic Usage 这个插件可以帮助生成 HTML 文件,在 body 元素中,使用 script 来包含所有你的 webpack bundles,只需要在你的 webpack 配置文件中如下配置:复制代码 var HtmlWebpac...转载 2018-02-25 18:02:04 · 980 阅读 · 0 评论 -
textContent、innerText 以及Event事件兼容性问题
今天在完成前端的简单练习时发现了一些兼容性的问题,百度后得以解决. 这里主要讨论Firefox与Chrome的兼容性问题.textContent与 innerText在javascript中, 为了获取节点的文本, 我们可以考虑使用节点的textContent、或者innerText, 然而,两者都并不能很好对所有浏览器进行兼容.textContent: 不支持低版本 IE; 兼容...转载 2018-04-13 15:55:35 · 819 阅读 · 0 评论 -
表单checkbox非多选,给一个空数组添加元素,如果有就删除这一项,如果没有就添加这一项
“` //主要逻辑HandleToggleChooseDeveloper = e => { console.log('getuserID', e.target.getAttribute('user-id')) let Node = e.target let Id = Node.getAttribute('user-id') let choose =...原创 2018-06-03 22:18:09 · 936 阅读 · 0 评论 -
根据日期来划分一个数组,将同一日期的归为统一的数组中
例如: /* *由[{ * activityId: '121', // 操作Id * projectId: '122222', // 所属项目Id * activityType: 1, // 操作类型,如增删改查,0表示新增、1表示更新、2表示删除 * fileName: '分析实验', // 操作内容名称 * ...原创 2018-06-07 11:54:13 · 1768 阅读 · 0 评论 -
axios onUploadProgress
上传文件进度条,使用axios的onUploadProgress<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name=&qu原创 2018-07-25 10:26:38 · 10705 阅读 · 0 评论 -
移动端适配不同手机
移动端 1.不建议字号用rem原因: 考虑到字体的点阵信息,一般文字尺寸多会采用 16px 20px 24px等值,若以rem指定文字尺寸,会产生诸如21px,19px这样的值,会导致字形难看,毛刺,甚至黑块,故大部分文字应该以px设置。 一般标题类文字,可能也有要求随屏幕缩放,且考虑到这类文字一般都比较大,超过30px的话,也可以用rem设置字体。 2.移动端的1px边框问题解决方法:原创 2018-01-11 13:21:56 · 851 阅读 · 0 评论 -
48个javascript代码片段
javascript,递归,array方法原创 2017-12-18 10:24:00 · 415 阅读 · 0 评论 -
移动端拖拽事件
<script type="text/javascript"> var img = document.querySelector("#yangyang"); //信号量 var x = 100; var y = 100; var startX,startY,dx,dy; //触摸开始 img.a原创 2017-12-19 23:45:27 · 1667 阅读 · 0 评论 -
指滑轮播图
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>指滑轮播图</title> <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">原创 2017-12-19 23:52:44 · 706 阅读 · 0 评论 -
抛掷方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">原创 2017-12-19 23:55:57 · 294 阅读 · 0 评论 -
js已知两个数组,这两个数组中有相同项,要把A数组中与B数组相同的项删除
let newInfo = this.state.allDataNew; for(let i = 0; i < newInfo.length;i++) { for(let j = 0; j < idArray.length;j++) { if(newInfo[i].id == idArr原创 2017-12-12 18:24:39 · 2380 阅读 · 0 评论 -
js将一个数组分成二维数组
例如:let dataArray = [1,2,3,4,5,6,7,8,9,10,11,12,13,14]; 将这个数组分成modifyArray = [[1,2,3,4,5,6,7],[8,9,10,11,12,13,14]]; let data = [3, 6, 4, 5, 6, 99, 55, 45, 33, 22, 90, 12, 54, 23, 33, 243, 2324, 12,原创 2017-12-13 15:03:10 · 6276 阅读 · 0 评论 -
html字符串中匹配所有img的src
html字符串中匹配所有img的src原创 2017-12-13 18:21:14 · 1745 阅读 · 0 评论 -
已知某个网址http://www.***.com,扒出所有的新闻
已知某个网址http://www.***.com,扒出所有的新闻原创 2017-12-13 18:26:34 · 17259 阅读 · 0 评论 -
图片上传相关
图片上传相关原创 2017-12-14 12:52:05 · 336 阅读 · 0 评论 -
淡入淡出轮播图jquery
淡入淡出轮播图jquery原创 2017-12-14 12:54:52 · 423 阅读 · 0 评论 -
根据不同分辨率显示相同web页面
根据不同分辨率显示相同web页面原创 2017-12-14 17:16:45 · 2248 阅读 · 0 评论 -
将对象转为url中?后缀的参数
将对象转为url中?后缀的参数function changeJSON2QueryString(JSON){ var temp = []; for(var k in JSON){ temp.push(k + "=" + encodeURIComponent(JSON[k])); } return temp.join("&");}let obj = {原创 2017-12-15 23:55:14 · 1255 阅读 · 0 评论 -
将对象转为url中?后缀的参数
将对象转为url中?后缀的参数原创 2017-12-15 23:56:54 · 781 阅读 · 0 评论 -
移动端触摸事件
ouchstart 开始触摸 touchmove 手指移动 touchend 结束触摸 touchstart 在手指触摸的一瞬间发生,如果有多个手指触摸,每个手指触摸的时候都会发生。 touchend 在手指离开屏幕的一瞬间发生,如果有多个手指离开,每个手指离开的时候都是触发这个事件。 绑定他们的时候,只能用DOM2级来绑定,不能用window.on*来绑定。** <script type原创 2017-12-19 23:40:37 · 720 阅读 · 0 评论