特效一览 滑箱： 果冻： 脉冲： 闪光： 气泡： 滑箱特效 原理 因为 button 元素可以使用 before/after 伪元素，所以借助伪元素，可以实现动态图中的遮盖层。 为了避免回流重绘，滑箱的运动方向是垂直方向，所以使用scaleY属性。对于动画的方向，需要借助transform-origin改变动画原点。 代码实现 html： <...

这是阅读《MongoDB 实战》所做的，关于基础、编码和优化方面的读书笔记。 MongoDB 特性和介绍 1. 简介 MongoDB 的特点：扩展策略、直观的数据模型。在 mongodb 中，编程语言定义的对象能被“原封不变”地持久化，消除对象结构和程序映射的复杂性。 2. 主要特性 数据模型 关系型与正规化：对于关系型数据库，数据表本质上是扁平的，因此表示多个一对多关系就需要...

特效一览 划线动态： 动态边框： 划线动态 原理和代码 :before 和 :after伪元素指定了一个元素文档树内容之前和之后的内容。由于input标签不是可插入内容的容器。所以这里下划线无法通过伪元素来实现。需要借助其他 dom 节点。 <div> <input type="text" /> <span></span&...

特效一览 划线动态： 背景高亮： 色块进出： 划线动态 原理 首先，利用::after和::before就可以画出上下两条线，所以只需要一个 dom 元素即可。 其次，对于鼠标移入的动画，要给上面两个伪元素设置:hover选择器。 最后是处理动画方向。我们以上面的线条为例，在鼠标移入的时候，是从右到左变化的。这里是通过设置transform-origin属性来修改...

介绍 HTML5 为我们提供了 File API 相关规范。主要涉及 File 接口 和 FileReader 对象 。 本文整理了兼容性检测、文件选择、属性读取、文件读取、进度监控、大文件分片上传以及拖拽上传等开发中常见的前端文件操作。 准备工作 首先，我们的 File 来自于<input>标签中选中的文件列表。所以，准备如下的 HTML 代码： <input ...

with Hongkai Redis 主要用途有 2 个 数据缓存，减轻 db 的压力 数据同步，在分布式系统中各个实例的信息同步 redis 的 QPS 量通常相当的大，动辄百万 QPS，一般企业都需要很庞大的 redis 集群资源。由于 redis 的使用相当频繁，经常会出现各种问题。根据目前积累的线上经验，redis 出现问题第一步就是要想到：redis 是单进程单...

这周，完成了大学中的最后一门考试。下周，就要回公司继续写代码，算是一半社会人、一半学生仔。2019 上半年经历了很多事情，虽然放在大群体里面平淡无奇，但对于我个人来讲，还是别开生面、值得回味。 TEG 工作 今年，是在腾讯深圳飞亚达大厦自己跨年的。截至 3 月初离开 TEG，已经在那里待了半年有余。第一次接触 React 开发，第一次开发团队的 UI 组件库，第一次开发富文本编辑器，记忆...

重建二叉树 1. 题目描述 输入某二叉树的前序遍历和中序遍历的结果，请重建出该二叉树。 2. 解题思路 前序遍历的第一个元素一定是树的根结点 在中序遍历中找到此节点，左边是左子树，右边是右子树 根据左右子树的长度，再次划分两个序列，进一步递归 3. 代码 /** * 二叉树结点类 */ class Node { constructor(value,...

替换空格 1. 题目描述 请实现一个函数，把字符串中的每个空格替换成”%20”。 例如输入“We are happy.”，则输出“We%20are%20happy.”。 2. 解题思路 一种是正则表达式：直接使用正则表达式全局替换，这种方法取巧一些。 另一种是先计算出来替换后的字符串长度，然后逐个填写字符。这种方法的时间复杂度是$O(N)$。 3. 代码 /** * 用正则...

用两个栈实现队列 1. 题目描述 用两个栈实现一个队列。队列的声明如下: 请实现它的两个函数appendTail和deleteHead，分别完成在队列尾部插入结点和在队列头部删除结点的功能。 2. 解题思路 一个栈用来存储插入队列数据，一个栈用来从队列中取出数据。 从第一个栈向第二个栈转移数据的过程中：数据的性质已经从后入先出变成了先入先出。 3. 代码 class Queu...