display:none opacity:0以及visibility:hidden的区别
display:none opacity:0以及visibility:hidden的区别
相同作用能够对元素进行隐藏
空间占据display:none;不占据空间，所以动态改变此属性时会引起重排。
visibility:hidden;元素会被隐藏，但是不会消失，依然占据空间。
opacity:0; ...
Flex弹性布局
Flex弹性布局
[[toc]]
容器的属性
flex-direction属性flex-direction属性决定主轴的方向（即项目的排列方向）。
.box { flex-direction: row | row-reverse | column | column-reverse; ...
CSS九宫格布局实现
CSS九宫格布局实现
[[toc]]
基本的布局
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="w ...
Dva封装
Dva封装
import React from 'react';import ReactDOM from 'react-dom';import {createStore,combineReducers,applyMiddleware} from 'redux';import &# ...
JS设计模式探索
JS设计模式探索
[[toc]]
单例模式var singleton = { name: 'hzf', age: 24, walk: function(){ console.log(this.age); //24 }, eat: function(){ ...
for in和for of区别
for in和for of区别
[[toc]]
for in以任意顺序遍历一个对象的可枚举属性。遍历数组时，key为数组下标字符串；遍历对象，key为对象字段名。
数组let arr = [{age: 1}, {age: 5}, {age: 100& ...
输入URL背后的技术步骤
输入URL背后的技术步骤
[[toc]]
一道经典的面试题，涵盖的知识点非常多，这里解答下该问题，以对自己的知识体系进行梳理。
系统层
发起http请求，解析域名
DNS
Chrome搜索自身DNS缓存。chrome输入chrome://net-internals/#dns可查看到
搜索操作系统自 ...
WebSocket & socket.io
WebSocket & socket.io
[[toc]]
前言
大家参与的项目里多少都会有web server与browser需要长连接互联的场景，比如即时通讯、即时报价等，为了解决这个问题，便出现了 WebSocket 协议，实现了客户端和服务端双向通信的能力。介绍 WebSocket ...
Promise & async
Promise & async
[[toc]]
Promise
主要用于异步计算
可以将异步操作队列化，按照期望的顺序执行，返回符合预期的结果
可以在对象之间传递和操作promise，帮助我们处理队列
实现一个 Promise
let resolvePromise = (promise2 ...
Fetch和Axios的区别
Fetch和Axios的区别
[[toc]]
AJAXconst xhr = new XMLHttpRequest();xhr.withCredentials = true; // 添加cookiexhr.onreadystatechange = function () { if ( ...
