在使用 flex 布局时，设置 justify-content: space-between，如果一行有三个 div，那最后一行如果不满三个元素，就会出现下面的情况，如何使最后一个 div 向左对齐呢。有两种方法：方法一：这种方法的缺点是，最后一个 div 左外边距是0。div:after {
content: "";
flex: auto;
}
方法二：创建几个空的 div，貌似这种方法最合适了 div
div class="item" /div
div class="item" /div
div class="item" /div
div cl
今天，写篇文章介绍一下 RESTful API 中的动词覆盖吧。在开发各种小程序的时候，总是会遇到不能正常支持 HTTP 请求的平台，比如支付宝小程序只支持 GET 和 POST 请求，这时候充分利用 HTTP 请求方法的 RESTful API 就会遇到问题，不支持 PUT, PATCH, DELETE 请求，该怎么办呢？嗯，使用动词覆盖。什么是动词覆盖我最初遇到不支持全部 HTTP 请求的时候，解决方案是修改 API 路径，比如 DELETE /user/:id 时，我的方案是 POST /user/:id/delete。后来看了阮一峰的《RESTful API 最佳实践实践 》，才明白有
场景1，有些用户很调皮，快速多次点击一个按钮。2，用户不必特地捣乱，他在一个正常的操作中，都有可能在一个短的时间内触发非常多次事件绑定程序。比如页面绑定的 resize 事件。分析怎么解决？函数节流就是一种办法。函数节流，简单地讲，就是让一个函数无法在很短的时间间隔内连续调用，只有当上一次函数执行后过了你规定的时间间隔，才能进行下一次该函数的调用。函数节流的原理挺简单的，估计大家都想到了，那就是定时器。当我触发一个时间时，先 setTimout 让这个事件延迟一会再执行，如果在这个时间间隔内又触发了事件，那我们就 clear 掉原来的定时器，再 setTimeout 一个新的定时器延迟一会执行
遍历目录遍历目录是操作文件时的一个常见需求。比如写一个程序，需要找到并处理指定目录下的所有JS文件时，就需要遍历整个目录。递归算法遍历目录时一般使用递归算法，否则就难以编写出简洁的代码。递归算法与数学归纳法类似，通过不断缩小问题的规模来解决问题。以下示例说明了这种方法。function factorial(n) {
if (n === 1) {
return 1;
} else {
return n * factorial(n - 1);
}
}
上边的函数用于计算 N 的阶乘（N!）。可以看到，当 N 大于 1 时，问题简化为计算 N 乘以 N-1
代码示例：html{
-webkit-filter:grayscale(100%);
-moz-filter:grayscale(100%);
-ms-filter:grayscale(100%);
-o-filter:grayscale(100%);
filter:grayscale(100%);
filter:url("data:image/svg+xml;utf8, svg xmlns=\'http://www.w3.org/2000/svg\' filter id=\'grayscale\' feColorMatrix t
MySQL在5.5.3之后增加了这个utf8mb4的编码，mb4就是most bytes 4的意思。之前 MySQL 的 utf8 只支持最长三个字节的 UTF-8字符，也就是 Unicode 中的基本多文本平面。低版本的MySQL支持的utf8编码，最大字符长度为 3 字节，如果遇到 4 字节的字符就会出现错误了。三个字节的 UTF-8 最大能编码的 Unicode 字符是 0xFFFF，也就是 Unicode 中的基本多文平面（BMP）。任何不在基本多文平面的 Unicode字符，都无法使用MySQL原有的 utf8 字符集存储。比如 Emoji 表情。utf8_unicode_ci比较准
Webpack file-loader 升级后 src= "[object Module]" 的解决方法，当 file-loader 的版本是 4.3.0 及以上，则需要在 webpack.config.js 中手动配置属性 esModule 。{
test: /\.(jpg|jpeg|png|gif|svg)$/,
loader: "file-loader",
options: {
esModule: false, // 默认值是 true，需要手动改成 false
}
}
esModuleType: Boolean Default: trueBy de
将一个div的宽度和高度设置为0，然后设置边框样式.triangle{
width: 0;
height: 0;
border-top: 50px solid black;
border-right: 50px solid red;
border-bottom: 50px solid green;
border-left: 50px solid blue;
}
将一个div的border都设置成50px粗，并且不同颜色，结果如下图所示：把边框宽度设置成50px，计算机处理时，在边框交接处，一边占用一半的面积。将左右下边框设置成transparent，就可
1.切记不要用字符串存储日期我记得我在大学的时候就这样干过，而且现在很多对数据库不太了解的新手也会这样干，可见，这种存储日期的方式的优点还是有的，就是简单直白，容易上手。但是，这是不正确的做法，主要会有下面两个问题：i. 字符串占用的空间更大！ii. 字符串存储的日期比较效率比较低（逐个字符进行比对），无法用日期相关的 API 进行计算和比较。2.Datetime 和 Timestamp 之间抉择Datetime 和 Timestamp 是 MySQL 提供的两种比较相似的保存时间的数据类型。他们两者究竟该如何选择呢？通常我们都会首选 Timestamp。 下面说一下为什么这样做!2.1 Da
1，为什么要画流程图很多人拿到需求就火急火燎的开始画原型，然后画着画着觉得有些地方没有考虑到，又回头去改，如果在画原型之前，你能将自己的业务流程想好，用户的操作流程想好，页面跳转想清楚，你就能少做很多无用功，达到事半功倍的效果。2，什么是流程图流程图是表示算法、工作流或流程的一种框图表示，它以不同类型的框代表不同种类的步骤，每两个步骤之间则以箭头连接。这种表示方法便于说明解决已知问题的方法。流程图在分析、设计、记录及操控许多领域的流程或程序都有广泛应用。3，流程图常用元素定义4，一般流程图有三种结构：顺序结构、选择结构、循环结构5，常用的三种流程图产品中设计的流程图主要有三种，业务路程图（泳道
写好代码，阿里专家沉淀了一套“如何写复杂业务代码”的方法论，在此分享给大家，相信同样的方法论可以复制到大部分复杂业务场景。一文教会你如何写复杂业务代码了解我的人都知道，我一直在致力于应用架构和代码复杂度的治理。这两天在看零售通商品域的代码。面对零售通如此复杂的业务场景，如何在架构和代码层面进行应对，是一个新课题。针对该命题，我进行了比较细致的思考和研究。结合实际的业务场景，我沉淀了一套“如何写复杂业务代码”的方法论，在此分享给大家。我相信，同样的方法论可以复制到大部分复杂业务场景。一个复杂业务的处理过程业务背景简单的介绍下业务背景，零售通是给线下小店供货的B2B模式，我们希望通过数字化重构传统
安装 node-sasssudo npm i -g node-sassnode-sass 安装失败：gyp ERR! stack Error: EACCES: permission denied, mkdir '.../node-sass/build'或gyp ERR! configure error gyp ERR! stack Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/node-sass/.node-gyp'gyp ERR! System Darwin 18.7.0使用 --unsafe-per
本方法不易维护，建议取出数据，在程序中递归，例如 https://javascript.net.cn/article?id=654代码如下：delimiter /
DROP FUNCTION IF EXISTS `getChild` /
CREATE FUNCTION `getChild`(rootId INT)
RETURNS VARCHAR(1000)
BEGIN
DECLARE ptemp varchar(1000);
DECLARE ctemp varchar(1000);
SET ptemp = '#';
SET ctemp =ca
后端篇地址：https://javascript.net.cn/article?id=649相关文档：https://restfulapi.cn/d/271前端代码主要功能是，连接服务器，发送心跳，断开服务器后自动连接。/**
* JSSDK 对象
*/
var PigIM = {
config: {}, // 配置
fromId: {}, // 发送者 ID
ws: {}, // Websocket 对象
connection: {},
listen: {},
heartbeatTimer: {},
物理像素： 顾名思义，就是设备屏幕上的实际像素。也就是说这个手机被出厂造出来的时候，这个屏幕上有多少个像素点，他的物理像素就是多少； 设备独立像素： 也叫做逻辑像素(对于前端来说，和我们的css像素是一样的)，这个不同的设备是不一样的。在viewport为ideal-viewport模式时， 如iphone6此时的viewport为375px，代表着我们在css中写375px就可以达到全屏的效果；在移动端中会使用rem方案，来做不同设备间的适配:(function () {
function changeRootFont() {
var designWidth = 750, rem2p
作用：将一个数组转为用逗号分隔的参数序列。//该运算符主要用于函数调用。function push(array, ...items) { array.push(...items);} function add(x, y) { return x + y;} var numbers = [4, 38];add(...numbers) // 42//扩展运算符取代apply方法的一个实际的例子，应用Math.max方法，简化求出一个数组最大元素的写法。// ES5 的写法Math.max.apply(null, [14, 3, 77]) // ES6 的写法Math.max(...[14, 3, 7
body
canvas id="canvas" width="120" height="30" style="cursor: pointer" /canvas
input type="text" id="code" placeholder="不区分大小写"
input type="button" value="验证" onclick="clickEvent()"
/body
/html
script
var numArr = []
var canvas = document.querySelector('#canvas');
css :not()排除函数css:not()函数用来排除选择，not(x),其中的x为css选择器，但是x不能是not选择器，也就是说:not()排除选择器不能嵌套使用。css:not()排除选择器使用.sibcont{
background:#f1f1f1;
border:1px solid #bababa;
margin:20px;
padding:20px;
}
.sibcont ul{
margin:0;
padding:0;
list-style:none;
}
.sibcont ul li{
color:#C91010;
最近探究js原理的过程中遇到了这个挺有趣的问题。先贴代码：var a = {n:1}a.x = a = {n:2}alert(a.x) //undefined在弄懂这个之前，我们先普及一个知识点，就是在javascript运算符中，属性运算符的优先级高于赋值运算符的优先级。因此，a.x是先于赋值之前就进行的。就是说，a.x刚开始是undefined的，这是没错的。接下来我们探究一下连等赋值的赋值顺序：1、从左往右a.x赋值为{n:2};然后a赋值为{n:2};a的重新指向重写了a.x,即.x属性不存在，因此a.x输出为undefined。2、从右往左a赋值为{n:2};直接限制了a.x的赋值，
在文件上传的时候我们我们选择监控change事件来获取文件，如果第一次如果选择了A文件，当再次点开选择A 文件时，change事件没有触发，这时可以用如下方式处理.1. vue项目处理方式：this.$refs.uploadExcelId.value=null;复制该代码到项目中，并且把uploadExcelId换成自己input的ref即可。2. 普通js处理方式：event.target.value=”;尽量不要用删除dom元素，再添加这种操作方式，因为还需要在做事件绑定比较麻烦。