- 博客(21)
- 收藏
- 关注
RSS订阅原创 将图片转换为base64
使用canvas新建个canvas标签然后用css隐藏。之后获取此canvas元素，使用toDataURL方法转换。var canvas = document.createElement('canvas')var ctx = canvas.getContext('2d');var base64=canvas.toDataURL('image/jpeg',licenseUrl);使用 FileReader使用FileReader的readAsDataURL方法，...
2022-04-07 16:53:33
272
原创 遍历的性能（执行速度的角度）比较
1,js中有很多遍历方法：for（arr.length）;for... of... ;for...in...;数组的ArrayforEach;Map;filter;some;every;Map和Setfor...of...迭代器模式iteration成为迭代器，又叫遍历器。它的作用是给不同的数据结构(Array Map Set String TypedArray 函数的 arguments 对象 NodeList 对象)提供统一的遍历访问机制，这种
2022-03-12 11:37:10
1963
原创 行内元素和块级元素的区别
块级元素？总是在新行上开始； 高度，外边距和内边距都可控制； 宽度缺省是它的容器的100%，除非设定一个宽度。 它可以容纳内联元素和其他块元素行内元素？和其他元素都在一行上； 高，外边距和内边距不可改变； 宽度就是它的文字或图片的宽度，不可改变 内联元素只能容纳文本或者其他内联元素对行内元素，需要注意如下：设置宽度width 无效。 设置高度height 无效，可以通过line-height来设置。 设置margin 只有左右margin有效，上下无效。 设置padding
2022-02-18 13:57:40
94
原创 vue组件渲染过程
1，生成render 函数，生成vnode ,将虚拟节点patch(vnode)到绑定元素上。2，什么是虚拟done?虚拟DOM也就是我们常说的虚拟节点，他是通过JS的Object对象模拟DOM中的节点，然后在通过特定的render方法将其渲染成真实的DOM节点。为什么要使用虚拟节点？频繁的DOM操作会导致大量页面元素的重绘和回流，处于性能优化的考虑我们应该减少重绘和回流的操作。而对虚拟节点的DOM操作，并不会触发重绘和回流，把处理后的虚拟节点映射到真是DOM上，只需要进行一次重绘和回流，提
2022-02-18 13:36:03
1443
转载 vue指令v-for和v-if为什么不能同时使用
指令v-for和v-if不建议同时使用在vue2.x中，v-for优先级是高于v-if的，如果在同一个元素中使用了v-for和v-if，那么在渲染时，v-for的每一项都要重复运行v-if，这会降低渲染的效率解决方式可以将v-if的功能替换为 在一个计算属性上面遍历后使用computed: { activeUsers: function () { return this.users.filter(function (user) { return user.isActive...
2022-02-18 11:17:07
414
原创 文件上传系统
原理概述原理很简单，就是根据 http 协议的规范和定义，完成请求消息体的封装和消息体的解析，然后将二进制内容保存到文件。我们都知道如果要上传一个文件，需要把 form 标签的enctype设置为multipart/form-data,同时method必须为post方法。那么multipart/form-data表示什么呢？multipart互联网上的混合资源，就是资源由多种元素组成，form-data表示可以使用HTML Forms 和 POST 方法上传文件，具体的定义可以参考RFC
2022-02-07 13:47:03
582
原创 类声明，继承
1，大概分为四步： （1）新建个对象 eg: var obj = {} （2）将构造函数的作用域赋这个对象上。 eg: （3）在这个对象上调用这个构造函数 （4）返回这个对象...
2022-02-07 00:24:18
563
原创 使用element的表格实现点击编辑表格内元素。
功能：使用element的表格实现点击编辑表格内元素。分析：element使用的是插槽template的形式比iview UI更加具有html话，不是是使用renden函数自定义html,感觉更清明些。实现思路：v-if v-else 直接替换template。实现坑点：1，scope添加row.isEdit判断，结果不能实现，不能触发vue的重新渲染。解决：必须在data里改值会生效。2，由于在el-table-column下绑定的事件，所以我们只要判断是否在这一行。最终实现：
2022-01-14 15:35:14
1059
原创 数据的编码
1，base64编码： 1.1由来：网络上传输的字符并不全是可打印的字符，比如二进制文件、图片等。它是基于64个可打印的字符来表示二进制的数据的一种方法。电子邮件刚问世的时候，只能传输英文，但后来随着用户的增加，中文、日文等文字的用户也有需求，但这些字符并不能被服务器或网关有效处理，因此Base64就登场了。随之，Base64在URL、Cookie、网页传输少量二进制文件中也有相应的使用。 1.2编码演示 1.3结论：...
2021-11-01 13:55:46
94
原创 左边树，右边为视频窗口
1，问题一：左边树一次只能点击一个设备，右边为单状态的四窗口的视屏窗2，问题二：左边树一次只能点击一个设备，右边为多状态的1,4,16,36窗口。3，问题三：左边树一次可以点击多个设备，右边为单状态的四窗口的视屏窗4，问题四：左边树一次可以点击多个设备，右边为多状态的1,4,16,36窗口。...
2021-10-27 20:30:38
63
原创 关于调试过程遇到的问题
1，打包到服务上去检视页面效果：如果像jsp的没有经过编译的可以直接在source里面修改，有效果。如果是普通的vue项目，编译后放到服务上，看到的source也只是反编译的效果，修改源文件没有效果。并且编译后的debugger;没有效果。此时还是得console.log("")了。2，部署过程中，模块加载不出来，或者功能异常。可能性：一：代码拉取的版本不对， 前端分支不对，导致页面的有些模块加载不出来。 不分离的项目，版本...
2021-10-27 20:19:46
993
原创 前端页面html,css,js文件从加载到执行的过程
js的加载内部加载，外部应用，inport的导入，和require的导入window.onloadwindow.onready
2021-10-08 14:58:47
362
原创 关于页面在web端可以显示，在客户端不可以显示bug
问题描述：写好的jsp文件部署到环境上，可以正常显示，当使用客户端嵌入web端页面的时候html和css可以展示却没有数据。问题排查，（1）看看客户端的控制台，其实是有办法的，但由于客户端版本的问题不行。（2）找客户端大佬看日志是不是客户端拉取或者请求的问题。像这个项目在一个项目里加一俩个页面是只有当前页面出不来，一般不是这个情况。（3）看js执行了没，使用在首行js,alert弹出下无效,有可能是客户端不支持这个方法（实际是客户端支持这个方法），换一个隐藏元素的方法。结果：无效。（
2021-09-30 10:28:17
246
原创 事件委托的实现
1，为啥要事件委托？答：监听父元素，对于子元素的增加于减少，对于整体事件流程没有影响。否者将在每个子元素产生的时候添加事件不仅麻烦且不可预知。2，实现原理：答：事件冒泡：3，我的实现：<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-w
2021-09-25 19:25:33
363
原创 面试题_打印红绿灯问题
1，使用callback实现循环打印，间隔一秒打印红色，间隔俩秒打印绿色，间隔三秒打印黄色。var logLight = function(){ setTimeout(()=>{ console.log("now is 红灯"); setTimeout(()=>{ console.log("now is 绿灯"); setTimeout(()=>{ console.log("now is ...
2021-09-13 23:24:53
295
原创 教你如何写初/高级前端简历
进击的web前端开发前端企鹅圈：784783012 分享学习方法和需要注意的细节110 人赞同了该文章1. 前言本文仅是针对初高级技术岗位哈。参与了部门的实习生招聘工作，收到了很多同学的简历。发现有一些同学的简历写得不是很好看。 但是，仔细聊了聊之后发现，这些同学其实技术是很厉害的，只是不知道该如何写在简历上，不知道如何“包装”自己。在这过程中，也给一些同学的简历提了一些建议，结合自己写简历的经验，在这里写一篇文章聊一聊，如有不足之处还望指出和补充。本文的主要内容：为...
2021-09-12 22:22:45
4283
原创 对象数组排序
var arr = [ {name:'zopp',age:0}, {name:'gpp',age:18}, {name:'yjj',age:8}];function compare(property){ return function(a,b){ var value1 = a[property]; var value2 = b[property]; return value1 - value2; }}cons.
2021-06-06 22:21:43
46
原创 树状数据处理原生js
let data = [ { id: 1, address: '安徽', parent_id: 0 }, { id: 2, address: '江苏', parent_id: 0 }, { id: 3, address: '合肥', parent_id: 1 }, { id: 4, address: '庐阳区', parent_id: 3 }, { id: 5, address: '大杨镇', parent_id: 4 }, { id: 6, address.
2021-05-27 23:15:06
119
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人