Trekerz's blog

create-react-app

2018-05-30

流程套路

使用npx创建一个react项目 npx create-react-app test 如果是想要创建Typescript版的项目，则使用下面这条命令： npx create-react-app test --typescript 编辑.editorconfig文件 .editorconfig..

dpr(devicePixelRatio)的概念与应用

2017-12-03

对设备像素比的理解

一、理清dpr的概念devicePixelRatio，中文名称是设备像素比。这个概念在移动开发的时候会被特别关注，因为它关系到了整个画面的观感、布局甚至是清晰度。在JavaScript BOM中，它是window全局对象下的一个属性，它的定义如下： dpr = 设备像素 / CSS像素也有..

一道简单的面试题

2017-11-30

记录面试

11月29日去面试，遇到了一道比较常见的面试题，当时因为忘了一个知识点而没做出来，想想可能是因为昨晚没睡好，导致一整天都有点魂不守舍。反正回来之后自己整理了一下，一下子就做出来了。以下是题目解答以及扩展。题目：这是一个有关航班号和对应价格的嵌套对象，要求按照价格从低到高排序，并输出到DOM中..

浏览器js脚本与防止抢购脚本的方案

2017-11-28

前端防重复点击方案

JS是作为一种浏览器端脚本诞生的，这个特点使得JS脚本配合浏览器开发者工具可以完成一些特殊的功能。例如：刷抢购按钮。这里我写了一个简单的刷抢购demo： for (var i=0;i<100;i++){ btn.click();} 一般我们可以在浏览器调试工具中..

JS中用for...in...遍历数组遇到的坑

2017-11-27

尾部多出函数项

今天在用JS写数组去重算法时候遇到一个跟for...in...有关的问题。函数原本是这么写的： Array.prototype.unique = function (){ var arr = this; var obj = {}; var data..

CSS格式化上下文概念解析

2017-11-22

BFC(详细)、IFC、GFC、FFC

前几天在看flex布局的时候遇到了BFC这个概念，于是顺便看了几篇相关的文章，了解了几种上下文布局的基本概念，归结如下。今天在看flex布局的时候遇到了BFC这个概念，于是顺便看了几篇相关的文章，了解了几种上下文布局的基本概念，归结如下。 FC的全称是：Formatting Contexts（格..

CSS处理居中问题总结

2017-11-21

水平居中、水平垂直居中

在HTML的标准盒模型中，居中是一个很常见的问题，不同标签的居中有不同的处理方式，在不同的浏览器中也会有不同的表现，今天就来归纳一下最常遇到的水平居中问题和水平垂直居中问题的处理方式。一、水平居中1.使块级标签中的内容居中（包括文字、图片、行内元素）(1) 方法text-align: cent..

Flex布局总结与实例

2017-11-20

【整理】flex容器项目属性、骰子实例

一、Flex 布局网页布局（layout）是 CSS 的一个重点应用： Flex 是 Flexible Box 的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性。它是2009年W3C提出的一种新布局方案，不同于传统的display+position+float+margin布局，Fl..