- 博客(96)
- 收藏
- 关注
RSS订阅
原创 前端小技巧集锦【持续更新中……】
记录一下前端开发过程中遇到的一些小问题以及解决方法。目录目录最近更新2019/10/23：在控制台使用document.designMode帮助进行调试知识汇总▍HTML篇一、加快audio标签音乐加载▍CSS篇一、图片剪裁防止图片变形二、消除input框选中时外边框三：带有透明度的渐变四：a标签的四个伪类定义顺序五、流光字六：使用伪元...
2018-08-10 10:17:55
2892
4
原创 如何在不引入第三个变量的情况下互换两个变量的值
如何在不引入第三个变量的情况下互换两个变量的值算术运算异或运算解构总结例：x = 4；y = 5。如何在不引入第三个变量的情况下互换x与y的值？算术运算第一种方法是加法。x = x + y;y = x - y;x = x - y;这个方案的缺陷在于，当x或者y足够大的时候，可能产生溢出。第二种方法，把加法变为减法，与方案一类似。x = x - y;y = x + y;x ...
2020-04-07 19:29:34
2719
原创 如何使用css实现网站变灰效果
目录示例代码分析grayscalesaturate总结参考为了悼念新冠病毒牺牲的烈士，很多网站都在清明节那天把网站设置成了灰色。示例我选择了几个网站，先来看看它们是如何实现网站变灰效果的。B站html.gray { -webkit-filter: grayscale(.95);}百度网盘body { filter: grayscale(100%);}百度...
2020-04-07 19:22:19
1068
原创 如何阅读源码？
看项目，首先看package.json。看其中的main配置项，这是整个项目的入口运行文件。看模块，首先看export。先看它导出的是什么，然后看它从哪里来，其中又进行了什么样的操作。...
2019-10-18 11:36:12
450
原创 程序员如何学习？
作为程序员，我们需要不停的学习才能保证自己不会退步。但是学习的路径那么多，我们应该如何选择呢？以下是我的结论：入门看视频；进阶看官方文档或书籍；精通看源码或书籍。▍入门入门看视频，因为看视频更易于了解，便于上手。强推B站（bilibili.com），这不是一个只有二次元的网站哦。在这个网站里，你搜索一下你需要的学习资料，你就能发现惊喜。另外看视频如何看呢？建议是第...
2019-10-18 10:37:17
398
原创 前后端传输数据工程结构化
如果前后端传输的数据规范没有统一的标准，那么维护起来将会非常困难，所以我根据以往的经验，综合总结了一套比较好的前后端通信数据结构。▍结构体{ code: 200, // 状态码 success: true, // 请求是否执行成功 msg: '', // 返回的消息。失败时返回报错信息，成功时为空字符串即可。 data: { /...
2019-08-23 12:58:13
358
原创 使用正则完成字符串的提取
提到正则，很容易就能想到它的校验功能。但其实正则不仅能校验，还能从字符串中捕获到符合自己要求的子字符串并进行提取。提取功能的实现是通过RegExp 对象方法和支持正则表达式的 String 对象的方法实现的。参考链接：https://www.w3school.com.cn/jsref/jsref_obj_regexp.asp...
2019-08-02 14:30:28
1053
转载 npm scripts同时执行多个命令
我们经常用npm start dev，npm start test等等来执行不同的命令，那如果需要同时执行多个命令应该怎么做？、▍安装concurrentlynpm i concurrently▍配置package.json"scripts": { "start": "concurrently \"npm run clientServer\" \"npm r...
2019-07-30 13:51:32
4327
原创 基于springboot+maven的swagger2安装教程
在前后端分离的模式下，一个清晰地api文档是必不可少的。而swagger就是一个非常容易搭建的api文档，只需要通过简单的配置就可以自动生成api文档。▍前提条件首先需要新建一个springboot+maven的项目。▍大致安装流程1、在pom.xml注入依赖；2、新建swagger2配置文件并配置相关信息；3、在controller中配置接口信息。4、启...
2019-05-30 13:56:17
1843
原创 git不显示贡献度的解决方案
近两个月，同时在弄好几个项目，疯狂coding，但是在github和码云上都没有显示贡献度。开始没在意，后来才发现是用户邮箱配置出错了。利用命令行查看了一下邮箱配置和用户名配置，原来是邮箱出了问题，改一下邮箱就好了。...
2019-05-29 09:11:29
1521
1
原创 IntelliJ IDEA中遇到的问题集锦
在使用IDEA做项目的时候遇到了一些问题，将问题和解决方案在此记录。目录▍新建maven项目报错▍创建的文件变成文本文件▍无法创建java文件▍application.properties在输入的时候没有自动提示▍新建maven项目报错新建maven项目后，在控制台下方会显示报错信息。解决方案如下：先执行clean命令，再执行compile命令。▍创...
2019-05-22 21:58:36
843
原创 GIT删除本地tag和远程tag
以tag v20190514为例，这个tag已经同步到远程，但是现在发现了一个问题，需要撤回该tag，git命令如下：删除本地tag：git tag -d v20190514删除远程tag：git push origin :refs/tags/v20190514...
2019-05-14 11:18:59
72064
1
原创 微信小程序（15）——实现：回到自己的位置
遇到一个需求，需要模仿高德、百度等地图，点某一个按钮能马上回到自己的位置。wxml:<map id='map' ……> <cover-image src='……' bindtap='clickControl'></cover-image></map>js:clickControl() { // map是id ...
2019-04-24 11:56:55
2331
原创 微信小程序（14）——自定义按钮样式
微信小程序自带有button按钮，而button按钮中的某些类型也被赋予特殊意义，比如：获取用户信息、意见反馈等。当我们需要用到这些特殊意义的按钮时，有时需要自定义按钮的样式，究竟应该怎样处理呢？// 以下为示例，不推荐使用标签选择器，实际环境中请选择类选择器classbutton { // 修改button的padding属性时，可直接进行 padding: 0; ...
2019-04-22 20:58:05
4335
原创 微信小程序（13）——利用utils.js时间戳转时间
碰到一个问题：我需要在页面上显示时间，但是后台传输给我的是时间戳（而且是字符串类型的时间戳），所以我需要将时间戳转换为时间。原数据结构如下图：操作方法如下：// require utils.jsconst utils = require('../../utils/util.js');// 获取数据成功后对数据进行处理const _this = this;…succe...
2019-04-21 10:08:55
1791
原创 解决连接远程桌面缓慢的问题
这两天在搞毕业设计的事情，需要用到服务器，但是当我想打开我的服务器的时候，却发现无论我怎么连接都连不上，开始我以为是我电脑卡慢的问题，但是我在网吧电脑上试过之后还是一样的卡慢，整整搞了三个多小时，我确实拿它没有办法了，只好使出最后的大招：重启服务器！重启服务器！重启服务器！！！我打开腾讯云，重新启动了服务器，重启完成之后，当我再次去启动我的服务器的时候，速度快了不是一点点，所以...
2019-04-14 17:09:13
11683
原创 忽略不必要提交到GitHub的文件以及文件夹
尝试过很多方法，只有这个方法才实测有效。▍解决方案在需要创建 .gitignore 文件的文件夹, 右键选择，Git Bash 进入命令行。 输入 touch .gitignore 在文件夹就生成了一个“.gitignore”文件。 然后用编辑器打开这个文件进行编辑就行了。如果你很牛，熟悉linux下的vi编辑的命令，也可以用命令来声明规则。 然后就写规则来操作要忽略的...
2019-03-29 21:25:33
537
原创 CSS斑马条纹背景
最近的一道面试题：css实现斑马条纹背景。▍效果▍源码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> .container { display: fl...
2019-03-21 10:26:13
1291
原创 微信小程序（12）——哪些应用适合做成微信小程序
随着微信小程序的不断完善，其用户量一直处于爆发式增长状态，各类型的小程序如雨后春笋，纷纷上线。但是，受微信小程序自身的限制影响，并不是所有的应用都适合开发出一款对应的小程序。▍微信小程序三大特点1、业务逻辑简单；2、使用频率低；3、性能要求低那么对应的，有一些应用是不适合于使用微信小程序的，比如直播类（斗鱼、熊猫、虎牙等），大型游戏类（吃鸡...
2019-03-04 13:13:04
842
原创 微信小程序（11）——去除滚动条
微信小程序（十）——利用scroll-view实现横向滚动讲了如何实现scroll-view的横向滚动，在实现滚动之后，发现有一个横向的滚动条存在，不是很美观，所以，我就想要去除这个滚动条。▍解决方案在样式表里加上如下代码，就可以去掉丑陋的滚动条了。::-webkit-scrollbar { width: 0; height: 0; color: transpare...
2019-02-13 16:25:04
2462
3
原创 微信小程序（10）——利用scroll-view实现横向滚动
这两天想做个小程序上线试试，小程序里需要用到横向滚动，却在做的过程中发现scroll-view即使加了scroll-x，也没有实现横向滚动的效果，于是查找了一下解决方案，解决方案如下：▍解决方案1、在scroll-view标签上加上样式属性：display: flex; white-space:nowrap；2、scroll-view标签下的一级栏目标签需要加上样式属性：dis...
2019-02-13 15:52:17
10092
1
原创 TortoiseSVN无法查看日志的解决方案
在使用版本控制器的时候，我们有时需要看到以往的日志。在我使用TortoiseSVN的时候，想要查看日志，但是却失败了，在网上查了一下相关的解决方案，最后解决了。▍解决方案1、编辑svnserve.conf，设置anon-access=none2、在authz文件中添加[/]*=▍参考链接TortoiseSVN无法查看日志和SVN LOG无法查看...
2019-02-08 15:23:14
14269
5
原创 Promise基本用法
Promise就是一个异步执行的解决方案，将原本异步发生的事情转化成同步。 ▍示例想让funA先执行，funB后执行 ▍初始代码funA: function () { if (xxx) { xxx; } else { xxx; }}funB: function () { if (xxx) { ...
2019-01-18 13:28:31
292
原创 超链接 target="_blank" 要增加 rel="noopener noreferrer"
我在a标签上使用了target="_blank"：<a href="xxx" target="_blank">了解更多</a>然后代码就飘红了，显示如下错误： Using target="_blank" without rel="noopener noreferrer" is a security risk: see https://m...
2019-01-08 17:57:29
8586
1
原创 在flex布局中，不要使用绝对定位（fixed、absolute）
昨天在写布局的时候遇到一个问题，在一部iPhone 5s上发现了一项布局错位问题，然而在其他机型上的布局都是正常的。今天同事晃过一眼代码，就说flex布局中不要使用position定位，容易出现定位错误。然后他帮我改了一个地方，去掉了flex布局，果然其中一个错位消失了。...
2019-01-04 14:47:03
18600
1
原创 addClass和removeClass的用法
一个需求中需要用到样式的改变，自然想到了addClass和removeClass，但是在用的犯了一个很低级的错误，导致纠结了半天。初始写法（错误写法）：if (isPlayMusic) { console.log('music-to-paused'); $('.fortune-test-activity-head-music').addClass('.fortune...
2018-12-25 14:33:51
14450
原创 html特殊字符代码
前端在做一些文案的时候，有时会用到一些特殊字符，比如：空格、箭头、大于小于号等。代码 显示 含义 &lt; < 小于号 &gt; > 大于号 &amp; & 并且 &quot; " 引号 &reg; ® 已注册 &copy; ...
2018-12-22 23:37:46
8206
原创 捕获移动端键盘Enter事件
最近做了一个需求，其中有个细节是能搜索，点击键盘上的Enter时能进行搜索，这就需要捕获键盘上的Enter事件了。其实键盘上的每个键都有一个键盘码，我们能获取其键盘码从而判断事件。按键 键码 ESC键 VK_ESCAPE (27) 回车键 VK_RETURN (13) TAB键 VK_TAB (9) Caps Lock键 VK_CAPIT...
2018-12-22 11:19:20
5902
原创 React框架中setTimeout中的this作用域问题
前两天接到一个需求，需要在一个弹窗的“确定”按钮上加一个倒计时，试过setInterval，未成功，就想到了用setTimeout，但是其中的this作用域倒是令我困扰了好长时间。初始大致的结构如下：// 错误代码fun() { …… if (……) { …… } setTimeout(this.fun, 1000);}this.f...
2018-12-03 13:14:19
1186
转载 VS Code快捷键
同时打开多个窗口（查看多个项目）打开一个新窗口： Ctrl+Shift+N 关闭窗口： Ctrl+Shift+W同时打开多个编辑器（查看多个文件）新建文件 Ctrl+N 历史打开文件之间切换 Ctrl+Tab，Alt+Left，Alt+Right 切出一个新的编辑器（最多3个）Ctrl+\，也可以按住Ctrl鼠标点击Explorer里的文件名 左中右3个编辑器的快捷键Ctrl+1...
2018-11-28 12:34:37
140
原创 hasOwnProperty方法用法简介
hasOwnProperty表示是否有自己的属性。这个方法会查找一个对象是否有某个属性，但是不会去查找它的原型链。▍示例var obj = { a: 1, fn: function(){ }, c:{ d: 5 }};console.log(obj.hasOwnProperty('a')); // truecons...
2018-11-21 15:50:58
68430
2
原创 css中的filter滤镜和js中的filter方法
filter是滤镜，就是将某些东西过滤出来。 ▍css中的filter运用于对图像进行相关处理（就像P图一样，改变图片的颜色、饱和度等属性），详细解析可参考菜鸟教程。 ▍js中的filterfilter()函数是Array对象的一个方法。和map()不同的是，filter()把传入的函数依次作用于每个元素，然后根据返回值是true还是false决定保留还是丢弃该元素（返回值...
2018-11-21 11:36:21
1389
原创 Angular、Vue和React的区别
Angular、Vue和React都是目前比较流行的前端框架，不同的企业对其前端工作者有不同的要求，那么这三个框架之间有什么样的区别呢？ ▍Angular框架比较成熟完整，过于庞大，上手难； 指令以ng-xxx开头； 由谷歌开发和维护； 版本1比较适合PC端开发，版本2在往移动端靠； 不支持低版本浏览器； 内置指令和自定义指令； 内置过滤器和自定义过滤器； 支持双向数据...
2018-10-12 14:37:59
1679
原创 如何在不借助其他函数和第三个变量的情况下，更换两个变量的值？
如题，这是一个有趣的小题目。具体方法如下： ▍方法一var a = 3;var b = 4;a = a + b; // 7b = a - b; // 3a = a - b; // 4 ▍方法二var a = 3;var b = 4;a = a ^ b; // 7b = b ^ a; // 3a = a ^ b; // 4 显然，上...
2018-10-12 12:54:08
500
原创 typeof与instanceof
在 JavaScript 中，判断一个变量的类型尝尝会用 typeof 运算符，在使用 typeof 运算符时采用引用类型存储值会出现一个问题，无论引用的是什么类型的对象，它都返回 "object"。ECMAScript 引入了另一个 Java 运算符 instanceof 来解决这个问题。instanceof 运算符与 typeof 运算符相似，用于识别正在处理的对象的类型。与 typeof 方...
2018-10-09 17:49:45
136
原创 CSS选择器优先级比较
CSS选择器中比较常见的有标签选择器、ID选择器、类选择器以及子选择器。而事实上，CSS选择器如果细分下来，竟然多达40多种。那么当我们在碰到通过多种形式对同一个元素进行设置样式时的情况时，如果不进行测试，如何预测其最终结果呢？以下是选择器的优先规则：1、!important > id > class > 标签；2、!important 比 内联优先...
2018-10-09 16:16:45
2708
原创 js伪数组及其转化
在之前的笔试题中，遇到了一道题目：什么是伪数组？如何将伪数组转化为标准数组？ ▍什么是伪数组？一般符合以下三个条件的称之为伪数组：1、具有数组的length属性；2、按照索引方式存储数据（可以通过“[]”找到相应的项）；3、不具有数组的一些方法（push、pop等）。参考示例：var obj3 = { length: 0 };var obj4 = { 0: ...
2018-10-02 15:17:02
280
原创 JS求最大子序列的和
这是一道笔试题，给定一个数组，求出这个数组中最大连续子序列的和。例如：在数组[-2, 6, -1, 5, 4, -7, 2, 3]中，和最大的子序列是[6, -1, 5, 4]，它们的和是14。 function search(arr) { var maxSum = arr[0], sum = arr[0]; for(var i = 0, l = arr.length; i &l...
2018-09-29 20:58:05
1771
1
原创 浏览器重绘与重排
当我们在做前端开发的时候，肯定会碰到操作DOM的情况，在操作DOM的时候，就会引起浏览器的重绘与重排。 ▍重绘如果DOM变化仅仅影响的了visibility、outline、背景色等等非几何属性，此时就发生了重绘（repaint）而不是重排，因为布局没有发生改变。 ▍重排当DOM变化影响了元素的几何属性（宽、高改变等等），浏览器此时需要重新计算元素几何属性，并且页面中...
2018-09-20 16:34:35
841
原创 在HTML中，url、href和src的应用
在前端开发过程中，会遇到三个比较相似的东西：url、href和src。这三个都是表示路径的，那它们之间有什么样的区别呢？又应该在什么时候应用它们呢？ ▍urlURL是一个网址。URL不是属性。在HTML中，一般仅用于引用图片路径。使用示例：.demo { background-image: url(http://www.yule.com.cn/uploadfile/2...
2018-09-20 12:11:30
1514
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人