WX_安琪拉打野怪-CSDN博客

原创移动端H5,软键盘的确认按钮变成搜索, 并实现搜索功能

有实现这样的功能,页面上的元素需要具备以下几个特性:input框需要用form表单包裹起来 input框的type="search" form表单需要具备的属性为:// 1. action里如果写东西时候,会报错// 2. e.preventDefault()写了这句代码,可以保证表单第一次提交的时候不刷新页面<form onSubmit={(e) => { e.preventDefault();xxxFun()}} action="" > <Input..

2021-09-13 14:04:45 1325

原创开启企业微信调试模式

前文想不到吧,企业微信有调试模式,打开之后就是这样啦~界面跟我们的谷歌浏览器调试模式一模一样(但是有点卡~~)下面来讲一下怎么开的, 正文开始~~~~正文准备工作企业微信PC版 pak文件: devtools_resources.pak(点击下载) 查询到我们电脑上安装的企业微信版本:4. 找到我们的企业微信安装路径(不知道放在哪儿了,那么就借助工具,搜索上述版本号):这就是安装路径了,将我们再步骤2中下载的pak文件放在上图所示的文件...

2021-09-09 09:51:23 2140

原创如何查找一篇英文文章中出现频率最高的单词？

先将该字符串用空格分隔为一个数组, 遍历该数组,将其出现的次数以及单词元素用map存储起来,然后循环map,找出出现次数最多的项function findMaxFrequency (str) { if (!str) return 0; let arr = str.split(' '), len = arr.length, objMap = new Map(); for(let i = 0; i < len; i++) { if (arr[i]) { if (obj

2021-06-27 18:05:01 1234

转载前端解决跨域的九种方法

什么是跨域？跨域是指一个域下的文档或脚本试图去请求另一个域下的资源，这里跨域是广义的。广义的跨域：1、资源跳转：A链接、重定向、表单提交2、资源嵌入：<link>、<script>、<img>、<frame>等dom标签，还有样式中background:url()、@font-face()等文件外链3、脚本请求： js发起的ajax请求、dom和js对象的跨域操作等其实我们通常所说的跨域是狭义的，是由浏览器同源策略限制的一类请求场景。.

2021-06-20 00:11:33 179

原创 Git回滚代码到某个commit

回退命令：$ git reset --hard HEAD^ 回退到上个版本$ git reset --hard HEAD~3 回退到前3次提交之前，以此类推，回退到n次提交之前$ git reset --hard commit_id 退到/进到指定commit的sha码强推到远程：$ git push origin HEAD --forcega...

2021-06-17 16:37:43 56

原创剑指 Offer 06. 从尾到头打印链表

看到这个题目,盲目了

2021-06-08 11:46:53 48

原创 vue源码解析---data，Observer，Dep，Watcher之间的关系

一、data，Observer，Dep，Watcher之间的关系上图截自《深入浅出vue.js》。通过Observer类提供的方法，将data转化为具有getter以及setter的数据。并在getter中收集依赖装在Dep中，

2021-05-29 15:53:40 618 1

原创 typeScript入门

1.全局安装typescriptnpm install typescript -g2.新建ts文件,并写下一段代码3.编译ts文件手动编译,生成相应的js文件,在浏览器中运行查看结果:tsc demo.ts手动编译效率低,可适当借助工具来做这件事情,添加工具ts-node, 使用ts-node,可以不用编译文件,直接在控制台打印结果,这样看结果会更加的方便;npm install -g ts-node结果:这样就开启了typescript之旅,接下来就开始了..

2021-01-28 19:46:54 304

原创前端常用的排序算法

冒泡排序方法: 比较相邻两个数据的大小,将大的数据换到右边或者左边,这样将每一轮最大的值放在一端.时间复杂度为n²；该方法有两层for循环,一次数据交换;第一层是确定需要冒泡的次数;第二层循环是确定需要对比的次数;题外话: 脑袋里有个游戏场景还原这个算法. 假如这些需要比较的数字排成一列. 现在要对它进行排序,我们要做的就是拿着第一个数字与其他的数字进行比较,如果比自己手上拿的数字大,就拿上大的,留下小的,继续往前走,直到上次比较完最末的位置; 走完一轮继续下一轮,直到当前位置等于上次比较完的最末的

2021-01-04 19:45:00 221

原创当try-catch-finally遇上return的执行顺序

1. return在try-catch-finally之外2. return在try中3. return在catch中4.return在finally中5.return在try与catch中6.return在try与finally中7.retrun在catch与finally中

2020-09-11 11:28:59 138

原创 promise, 异步,同步,定时器的执行顺序

通常情况下,js的执行顺序是从上到下的, 但是遇到定时器以及异步的时候情况会有所不一样.这时候想要理解它,得用宏任务以及微任务来解释了.js异步执行的机制是遇到宏任务就先执行宏任务,接着执行所有的微任务.然后再次从宏任务开始,找到其中一个任务队列执行完毕,再执行所有的微任务.微任务包括Promise、MutaionObserver、process.nextTick；宏任务包括setTimeout、setInterval、I/O等示例如下： console.log('js-start');

2020-08-31 12:01:18 2468

原创 vue单页项目常用优化

vue项目是单页应用,项目在第一次加载的时候会将大部分内容都加载进来,故而会导致加载很慢,以下是优化方案:1.使用cdn加载一些不常变化的文件,比如用到的UI框架,vue脚手架相关的文件 (参见vue项目优化--引入cdn文件)2.将静态的js,css以及图片放到第三方服务器3.按需加载路由4.webpack-parallel-uglify-plugin 可以优化打包js文件5.在代码层面进行优化:(1) 将重复的功能分块提取出来,封装成组件,让代码进行有效的复用(2) 尽量..

2020-08-02 17:15:39 149

原创单向链表

2020-06-24 16:34:36 89

原创 rel=preload进行内容预加载

背景<link>元素的rel属性的属性值preload能够让你在你的HTML页面中<head>元素内部书写一些声明式的资源获取请求，可以指明哪些资源是在页面加载完成后即刻需要的。对于这种即刻需要的资源，你可能希望在页面加载的生命周期的早期阶段就开始获取，在浏览器的主渲染机制介入前就进行预加载。这一机制使得资源可以更早的得到加载并可用，且更不易阻塞页面的初步渲染，进而提升性能。相关文档一般情况下<link>用来记载css文件<link rel...

2020-06-15 14:43:46 2509

原创 vue项目优化--引入cdn文件

目的为了减少webpack打包之后包的体积,可以将一些不常改动的第三方的库放在cdn上。这里会用到webpack的插件html-webpack-plugin脱离vue-cli脚手架，webpack的做法安装html-webpack-pluginnpm install --save-dev html-webpack-plugin在webpack.config.js中引入该插件const HtmlWebpackPlugin = require('html-webpack-plugin')

2020-06-10 14:33:34 1022

原创 Vue-cli3.0引入全局预加载样式---以less为例

方式一: 自动化导入1.npm安装style-resources-loader2.在vue.config.js中添加以下代码: const types = ['vue-modules', 'vue', 'normal-modules', 'normal'] types.forEach(type => addStyleResource(config.module.rule('less').oneOf(type)))function addStyleResource(rule) {

2020-05-14 20:45:19 2051

原创 vue脚手架切换以及切换过程中遇到问题的解决方案

之前一直用vue-cli2.0开发项目,突然之间用vue-cli3.0竟然不知道从何处下手,见笑了..vue-cli2.0切换到vue-cli3.0需要先卸载2.0的,然后再安装3.0的卸载:npm uninstall vue-cli -g 或 yarn global remove vue-cli安装:npm install -g @vue/cli 或 yarn global ...

2020-01-03 11:00:30 404

原创正则表达式(手动整理,手动编写)

1.验证0-100(不能等于0,等于100,精确小数点后两位)/^((0\.\d{0,2})|([1-9]{1,2}(\.[0-9]{1,2})?)|100)$/2.大于0的数字/^([1-9]\d*)$|^([1-9]\d*(\.\d{0,2}))$|^(0\.\d{0,2})$/

2019-07-22 20:52:41 149

原创 vue--前端接收后台传过来的excel文件数据,并在前端做下载

一.思路:1.利用Bold接收数据2.利用a标签做文件下载二.相关代码axios.post(url, queryParams, { responseType: 'arraybuffer' }).then((_res) => { const blob = new Blob([_res.data], { type: 'application/vnd.ms-ex...

2019-06-26 10:54:25 13469 3

原创 elementUI上传过程中限制尺寸

要点:1.上传之前的的钩子函数2.利用promise返回图片加载的状态代码如下:beforeAvatarUpload (res, file) { const isSize = new Promise((resolve, reject) => { let width = 220 let height = 220 le...

2019-06-25 14:49:42 1017

转载解决Chrome插件安装时出现的“程序包无效”问题

转自：https://blog.csdn.net/ysq5202121/article/details/50809494某些用户在Chrome插件网下载了Chrome插件后，不知道怎么才能把它安装到Chrome浏览器中，用户可以根据本站提供的教程：怎么在谷歌浏览器中安装.crx扩展名的离线Chrome插件？把下载后的扩展名为crx的Chrome插件安装到谷歌浏览器中。但是，由于一些特...

2019-03-30 20:06:37 5535 1

原创谷歌调试Node

1.运行目标脚本: node --inspect xx.js;打开浏览器访问：127.0.0.1:端口号2.在Chrome浏览器的地址栏输入：chrome://inspect或者about:inspect；回车3.点击inspect，进入调试界面4.在sources项目栏中搜索目标js，打断点即可进行调试本文参考：http://www.ruanyifeng.com...

2019-03-11 18:50:20 139

原创设计模式-----知悉new创建过程

new创建对象的过程(1)新创建一个对象(object)(2)执行构造函数中的代码初始化对象(3)返回对象实例:var Test = function (price, num, name) { var _item = 1; this.price = price; this.num = num; this.name = name;}// 创...

2018-12-19 14:16:06 120

原创 js工具库(更新中......)

1.获取路径中的参数:function getUrlParams(href) { var theRequest = new Object(); if(!href) href = location.href; if(href.indexOf("?") !== -1) { var params = href.substr(href.inde...

2018-12-18 16:57:15 135

原创 javaScript设计模式学习(一)

下面的代码涉及到的有:1.链式编程2.在全局变量中定义方法的规范/*实现链式调用 */ // 创建对象 var CheckObject = function () {}; // 给对象的原型赋值 CheckObject.prototype = { checkName: function () { // 实现链式调用 retu...

2018-12-11 22:57:22 128

原创 node版本管理工具(可任意切换node版本)

使用该管理工具的原因:1.在下载插件或者下载某个项目的源码的时候总是会遇到对于node版本有要求的情况.之前处理这种情况的方式是将现有的node卸载掉,然后去官网下载对应版本,重新安装一堆的东西 .今天再次遇到这种事情,简直崩溃,因为安装这个东西就意味着这一下午就废掉了,而且遇到这种情况的概率还是很大的.因此为了彻底解决这个问题,找到了一个极好用的工具: nvm.它主要针对nodejs的版本进...

2018-12-07 15:43:09 5465

原创 js---数字精确小数点后两位

传入的参数可以是任意类型,如果不符合条件,则转换输出的数字为:0.00 function toDecimal2 (num) { var result = '0.00'; if(num) { var f = Math.round(parseFloat(num) * 100) / 100; if(!isNaN(f)) { result = f.toStri...

2018-11-21 17:30:06 1043

原创 svg写动画常用属性的介绍

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .container{ margin: 200px;

2018-10-26 17:28:49 801

原创 express起步

简介express是一个轻便的nodeJS框架，可以使用它快速建立一个完整功能的网站。其核心为：（1）设置中间件来响应HTTP请求（2）定义路由表用于处理不同的HTTP请求（3）通过向模块传递参数来动态渲染HTML页面搭建在搭建该框架之前，需要先在本地安装node环境。node的安装教程自行查阅，此处不再赘述！那么现在叙述express的搭建过程：首先需要全局安装express...

2018-09-27 15:18:48 285

原创 js 类型检测(typeof进行检测)

1.js中的基本类型:字符串、数字、布尔、对象、Null、Undefined。而对象是个比较复杂的类型，其中又可以分为数组，函数与对象2.检测利用typeof来进行数据类型检测。它可以检测出来的数据类型有：string,number,boolean,function,undefined,object。数组，null与{}经过其转换后返回值都为object。所以重点就是怎么区分数组，nu...

2018-09-24 22:50:46 723

转载 webpack单入口和多入口配置

原文链接:https://segmentfault.com/a/1190000011333071配置文件webpack.config.js就是Webpack的配置文件，这个文件需要自己在项目根目录下手动建立。建立好后我们对其进行配置，先看下面的代码（webpack.config.js的基本结构），这是一个没有内容的标准webpack配置模版。webpack.config.js m...

2018-09-20 16:59:42 1399

转载 css等比例分割父级容器（完美三等分）

转自:https://blog.csdn.net/xiaobing_hope/article/details/51285695css等比例分割父级容器（完美三等分）父级容器的宽度一定，要实现子元素等比例完美均分父级宽度，实现方式有哪些？html部分代码：方法一：浮动布局+百分比（将子元素依次左浮动，根据子元素的个数，设定每个子元素的宽度百分...

2018-09-03 14:39:09 1050

原创父级div高度由子级div撑开; 里层div的高度始终与外层div的高度一样

<!DOCTYPE html><html><head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Page Title</

2018-08-25 23:58:59 9351 1

原创样式bug

1.span之间有时候会出现间隙,大概4px的样子;解决方案:在其父级加上font-size:0px;然后在span内部设置font-size

2018-08-15 15:22:47 134

原创 JS实现根据对象之间的id以及pid构建目录树

1.遍历得到顶层节点 var resultObj = [] function fn(jsonData) { //取得顶级的数据 var baseNode = jsonData.filter(function(element) { return element.pid === 0 }) resultObj.push(.....

2018-07-18 14:19:05 1755

原创阻止微信点击图片预览

1.问题:微信点击图片会预览2.思路(1)不让其点击(2)阻止默认事件3.解决方案(1)不让其点击:为图片添加以下属性pointer-events: none;或者:为该img加一个div,只不过div的层在img的上面所以采用z-index进行层的浮动(2)阻止默认事件为img添加以下代码(这是vue中的写法)@click.prevent="(()=>{return false})"js中...

2018-07-06 11:33:15 2487 4

原创 Promise 了解一下

1.概念Promise是异步编程的一种解决方案.它现被ES6收录原生提供了其对象2.特点(1)状态不受外界影响.Promise对象代表一个异步操作,有三种状态:pending(进行中),fulfilled(已成功)和rejected(已失败).只有异步操作的结果可以决定当前是哪一种状态,任何其他操作都无法改变状态(2)一旦改变就不会再变,任何时候都可以得到这个结果.Promise对象状态的的改变为...

2018-07-05 15:20:28 162

转载 JS获取CSS样式（style/getComputedStyle/currentStyle)

CSS的样式分为三类：内嵌样式：是写在Tag里面的，内嵌样式只对所有的Tag有效。内部样式：是写在HTML的里面的，内部样式只对所在的网页有效。外部样式表：如果很多网页需要用到同样的样式(Styles)，将样式(Styles)写在一个以.css为后缀的CSS文件里，然后在每个需要用到这些样式(Styles)的网页里引用这个CSS文件。getComputedStyle是一个可以获取当前元素所...

2018-07-05 14:58:48 229

转载 js的 new image()

本文转自https://blog.csdn.net/hdchangchang/article/details/9036511创建一个Image对象：var a=new Image(); 定义Image对象的src: a.src=”xxx.gif”; 这样做就相当于给浏览器缓存了一张图片。图像对象：建立图像对象：图像对象名称=new Image([宽度],[高度])图像对象的属性： bo...

2018-06-29 09:50:45 2197

转载搞清clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop

转载自：https://www.imooc.com/article/17571网页可见区域高：document.body.clientHeight网页正文全文高：document.body.scrollHeight网页可见区域高（包括边线的高）：document.body.offsetHeight网页被卷去的高：document.body.scrollTop屏幕分辨率高：window.screen...

2018-06-28 14:14:31 148

js 生成目录树

空空如也