樊小书生

cmock新增可视化功能，包含如下：1. 右上角搜索服务，支持搜索接口名称、接口url、接口mock文件名2. 右上角新增接口mock文件3. 左侧菜单对应配置的 mock 文件目录中的 mock 文件4. 修改接口配置mock文件5. 删除接口mock文件6. 尝试发送接口请求，及时预览接口返回结果

现有如下代码段，执行输出什么：Promise.resolve().then(setTimeout(() => { console.log(1)}, 0))Promise.resolve().then(_ => { setTimeout(() => { console.log(2) }, 0)})setTimeout(() => { console.log(3)}, 0)输出： 1 3 2首先明确， .then 或者 .catch 的参数

在日常开发中有很多时候需要动态加载js文件的场景，先看代码再看例子。/** * 动态加载js文件 * @params {String} url 动态加载js文件路径 * @params {Funtion} callback 加载完js文件之后的回调 * @params {String} id 动态加载js文件的script标签的id * @params {Object} parent 动态加载js文件的script标签放在哪个父元素下，默认值为document.body */function

阶乘指从1乘以2乘以3乘以4一直乘到所要求的数。0! = 1; 1! = 1; 2! = 1 * 2 ; 3! = 1 * 2 * 3; n! = 1 * 2 * 3 * …… * n ;我们在代码里面肯定是不可能这样实现的，因为n的不确定性，所以我们要写一个函数来实现。

前段时间做的一个集助活动，其中有一个倒计时，需要计算两个时间节点之间的差值，然后转化为时分秒，我用的是将两个时间节点传入new Date()，然后getTime()计算差值，代码大致如下：// 仅是两个时间点是同一天的简单换算function timeFormat(newTimeStr, oldTimeStr){ var newTime = new Date(newTimeStr)....

momentjs是一个用于解析、验证、操作和格式化日期的轻量级JavaScript日期库。使用方式：<script src="moment.js"></script><script> moment().format();</script>当前你也可以引入中文语言包：

元素的位置是以像素来度量的，有两个不同的点作为坐标系的原点： 文档的左上角 在其中显示文档的视口的左上角 在顶级窗口和标签页中，视口只是实际显示文档内容的浏览器的一部分：他不包括浏览器的“外壳”（如菜单、工具栏和标签页）。针对框架页中显示的文档，视口是定义了框架页的<iframe>元素。 无论在何种情况下，当讨论元素的位置时，必须弄清楚所...

本文转自：https://uedsky.com/2016-06/mobile-modal-scroll/问题众所周知，移动端当有 fixed 遮罩背景和弹出层时，在屏幕上滑动能够滑动背景下面的内容，这就是臭名昭著的滚动穿透问题。之前搜索了一圈，找到下面两种方案：css 之 overflow: hidden.modal-open { &, body { o...

前段时间写了一个canvas应用——将方形图片处理为圆形 ，最近就想把这个完善一下，所以就再补充一个圆角矩形的canvas处理方式。例子你可以直接点击此处查看 例子 ，先一睹为快。 参数 参数 默认值 描述 img 图片(img)对象 type 0 设置生成图片的大小：0设置生成的图片大小是以图片设置的css大小为准，1设...

本文转自：scrollIntoView 与 scrollIntoViewIfNeeded API 介绍根据 MDN 的描述，Element.scrollIntoView()方法让当前的元素滚动到浏览器窗口的可视区域内。而Element.scrollIntoViewIfNeeded()方法也是用来将不在浏览器窗口的可见区域内的元素滚动到浏览器窗口的可见区域。但如果该元素已经在浏览器窗口的可见区域...

关于input输入框fixed在窗口底部的时候，input获取焦点，弹出输入法，input会被输入法遮挡，导致输入内容不方便。我们可以用scrollIntoView 与 scrollIntoViewIfNeeded来解决这个问题。scrollIntoView 与 scrollIntoViewIfNeeded都是让当前的元素滚动到浏览器窗口的可视区域内。关于scrollIntoView 与 sc...

我们在做移动端项目的时候，经常会遇到手机旋转的一些事件，对于安卓手机，在QQ和微信中我们可以用下面这行代码禁止浏览器横屏（安卓手机的QQ和微信用的都是X5浏览器）：<meta name="x5-orientation" content="portrait">UC浏览器强制竖屏：<meta name="screen-orientation" content="p...

在项目中，针对一些时间处理的时候，难免会遇到要计算某年某月有多少天，这个大家都知道：一、三、五、七、八、十、腊(十二月)，是31天，四、六、九、十一是30天，二月又分为闰年29天、非闰年28天，但是这样的话就有会涉及到判断闰年，就比较麻烦，那有没有什么简单的方法呢？答案是有的：javascript中Date()对象的getDate()是获取时间对象对应于一个月中的某一天（1~31），当设置为0...

将table数据转为Excel表格放到前端来做可以减少服务器的压力，而且不受网速影响，速度响应快。下面是两个例子：原生js实现table数据转为Excel表格jquery.table2excel.js实现table数据转为Excel表格原生js的主要函数如下：function getExplorer() { var explorer = window.navigato...

支持中文/全拼/简拼以及自定义筛选的下拉列表

假如说有如下的需求： input的value部分有用，部分无用，我们希望input框获取焦点的时候直接选中无用的部分。我们就需要用到下面的主角：HTMLInputElement.setSelectionRange()，支持我们设置开始位置和结束位置，来实现input的选中效果。

最近在项目中遇到一个时间格式转换的要求。转换规则如果时间戳（下文中提到的时间戳都指向要转换的时间戳）在今天，则返回的格式为 “HH:mm:ss”如果时间戳在昨天，则返回的格式为 “昨天 HH:mm:ss”如果时间戳在本周内并且非昨天，假如说在周一，则返回的格式为 “周一 HH:mm:ss”如果时间戳在本年内并非一周内，假如说在1月12日，则返回的格式为 “01月12日 HH:m

功能描述在项目中我们经常会遇到要对textarea进行输入字符数的限制，并在下方提示共可输入多少文字，已输入多少，还可输入多少的类似功能。所以就有了下面封装好的这个函数，不管是以那种方式输入，字数都可以完美的限制。

之前虽然写了几篇关于textarea的高度自适应的解决方案，但都不甚满意，最近从Element的源码中得到启示，就自己写了一个textarea高度自适应的jquery插件。所以就有了本篇博客的介绍： autoHeightTextarea自适应高度的textarea是一款jquery插件，支持链式调用，支持设置最小行数、最小高度、最大行数和最大高度，在输入文字的时候实现textarea的高度自

最近自己写了一个关于textarea高度自适应的jquery插件，说明文档可点击查看此处：http://www.fxss5201.cn/project/html/textarea/autoHeightTextarea/之前说的textarea高度自适应是textarea在初始化的时候，将textarea的高度设置为scrollHeight的高度来实现其显示的时候高度自适应，但是大家应该都知道，

不要将原始布尔值的true和false与Boolean对象的真或假混淆。任何一个值，只要它不是 `undefined`、`null`、 `0`、`NaN`或空字符串（`""`），那么无论是任何对象，即使是值为假的Boolean对象，在条件语句中都为真。

canvas应用——将方形图片处理为圆形

本文转自：https://www.w3ctech.com/topic/112现代浏览器中获取实际宽度和高度现代浏览器(包括IE9)为IMG元素提供了naturalWidth和naturalHeight属性来获取实际宽度与高度 ，代码如下：var nWidth = document.getElementById('example').naturalWidth, nHeigh...

学习最好的方式就是一边看文档，一边动手，这样可以加深记忆。关于canvas绘制文本的内容你可以点击此处查看 例子 ，进行更好的互动学习。渲染文本方式填充文本：fillText(text, x, y [, maxWidth])边框文本：strokeText(text, x, y [, maxWidth])参数说明：text:要渲染的文本内容x:开始渲染文本的x坐标y:...

本文仅做翻译记录查看，GitHub原项目地址： https://github.com/RubaXa/Sortable/ ，建议将Sortable.js下载到本地，GitHub上的例子在复制到本地运行，在 http://jsbin.com 上运行很多时候会报Sortable is not defined 的错误。Sortable.js是用于在现代浏览器和触摸设备上重新拖放排序列表的JavaSc...

介绍steps.js是基于原生JavaScript的组件，可用于展示步骤条、时间轴等，功能支持：自适应支持横向和纵向显示，并且横向还支持居中显示支持自定义间距主轴线上下左右单方向及多方向分布支持数字和圆点及自定义图标，也可以使用图片如果标题和详情还不足以满足您的需求，你还可以插入自定义的html代码如果样式不满意，可以加入自定义的父类class，然后根据css的权重重新定义样式...

可以通过toString() 来获取每个对象的类型。为了每个对象都能通过 Object.prototype.toString() 来检测，需要以 Function.prototype.call() 或者 Function.prototype.apply() 的形式来调用，传递要检查的对象作为第一个参数，称为thisArg。var toString = Object.prototype.toStr...

一般在项目中，用户登录之后有消息通知的时候，用户头像上面会有一个消息数来提醒用户，但这个数字要保证新打开一个页面的时候是正确的，当切换浏览器的tab再回来的时候还要保证正确性。说到这可能有人觉得放一个定时器，过一段时间去获取一次不就可以了，但这样会相当耗性能，使用定时器，这个页面就算被隐藏（非当前标签页、最小化）也会去一直执行这个定时器，这就相当消耗资源，而且这个页面放很久的话，还会造成页面卡死...

数据双向绑定主要会用Object.defineProperty()，关于它的用法可查看：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty。可以直接点击查看例子。代码实现如下：<!DOCTYPE html><html l...

每个方法都有相应的描述、语法、参数、返回值、注意项（可选）、例子（可选）。语法中的[]里面中的内容表示参数为可选参数。Array.from()描述：从一个类似数组或可迭代对象中创建一个新的数组实例。语法：new_array = Array.from(arrayLike[, callback(element[, index[, array]])[, thisArg]]);参数：ar...

每个方法都有相应的描述、语法、参数、返回值、注意项（可选）、例子（可选）。语法中的[]里面中的内容表示参数为可选参数。原文出自：https://fxss5201.github.io/practical-code-snippet/js/javascript/Array.htmlArray.prototype.lastIndexOf()描述：返回从数组中逆向找到给定元素的第一个索引，如果不存在...

Array.flat() 方法会递归到指定深度将所有子数组连接，并返回一个新数组。具体可查看Array.prototype.flat()

定制微信，手机QQ，QQ空间APP内的分享内容。示例：，此示例暂时只提供QQ和QQ空间分享（微信需要配置参数）。代码参照http://open.mobile.qq.com/api/component/share，修改点如下：将微信改为采用最新版1.4.0，并加入updateAppMessageShareData和updateTimelineShareData方法；增加wxUrl参数，微信...

介绍colorFormat.js是将颜色值转换为你需要格式的JavaScript库，现在仅支持浏览器支持的HEX/RGB/RGBA/HSL/HSLA等5种格式，任意格式之间互相转换。演示地址：http://www.fxss5201.cn/project/plugin/colorFormat/ 。可能颜色互转的时候有些微差距，这是由于JavaScript在小数计算时不够精确或者对数据进行了四舍五...

全景看图Pannellum专栏主要是对Pannellum做翻译，方便查看。Pannellum是一款轻量级，免费且开源的全景浏览器，适用于网络。它使用HTML5，CSS3，JavaScript和WebGL构建，不受插件限制。官网（例子）：https://pannellum.org/特点Equirectangular，partial，cubic和multi-resolution全景图...

本文转自：https://www.cnblogs.com/yiven/p/7885528.html我们有时候可能需要自定义一些全屏事件，这个时候就要依靠JavaScript提供的全屏方法，废话不多说，直接上代码。//全屏功能function requestFullScreen(element) { // 判断各种浏览器，找到正确的方法 var requestMet...

screenfull.js是用于跨浏览器使用JavaScript Fullscreen API的简单包装器，可让您将页面或任何元素全屏显示，并且平滑浏览器实现差异，本文只是对封装方法做一个简单的翻译。github地址：https://github.com/sindresorhus/screenfull.js 。支持浏览器支持情况：https://caniuse.com/#feat=...

将json对象转化为json字符串，再判断该字符串是否为"{}"var obj = {};var b = (JSON.stringify(obj) === "{}");console.log(b); // truefor in 循环判断var obj = {};var b = function() { for

介绍fxss-rate评分插件是基于jQuery的插件，支持全星、半星、小数星、未选中星等多种显示样式，并且支持评分操作，不过操作评分的时候仅支持全星评价。demo地址：http://www.fxss5201.cn/project/plugin/fxss-rate/ github地址：https://github.com/fxss5201/fxss-rate ，如果感觉不错的话点个Sta...

本文翻译自：https://www.impulseadventure.com/photo/exif-orientation.html 。不了解Exif的同学建议先看一下维基百科Exif 。带方向传感器的数码相机允许自动旋转肖像图像。不幸的是，对此功能的支持并不普遍或一致地应用。带定向传感器的数码相机许多较新的数码相机（包括dSLR和Point＆Shoot数码相机）都配有内置方向传感...