1. Display: none 会让元素从渲染树中消失, 不占据任何空间. visibility: hidden 不会让元素消失, 仍然占据渲染空间只是内容不可见
2. Display: none 是非继承属性, 子孙节点的不可见原因为父节点没有在渲染树中渲染导致. visibility: hidden 是继承属性, 子孙属性的不可见是由于继承了父级的 hidden. 如果设置 visibility: visible 仍然可以展示出来
3. 修改 display 属性会触发子组件的回流而修改 visibility: hidden只会触发子组件的重绘
4. 读屏器会读取 visibility: hidden的内容, 但是无法读取 display: none 的元素

1. 参数位置, GET 请求参数通过 url 传递, post 放在 request body 中
2. 大小限制, 限于浏览器 和 nginx 对 url 长度的限制, get 的参数也会受到限制; eg: 当初在百家号我把质量检测接口搞挂的情况, 因为每次质量检测需要上传富文本中的所有内容. 我把 POST 接口改成了 GET
3. 缓存性, get 请求会被浏览器主动缓存, post 不会, 除非手动设置
4. 从表面上看 POST 似乎比 GET 更加安全. 因为普通用户看不到请求参数. 但是实际上想看的用户你是拦不住的
5. GET请求只能进行url编码，而POST支持多种编码方式
6. 从后端角度看, 接收 GET 请求参数直接同步处理即可. 但是想要接收 POST 请求参数的话就需要异步监听 data 事件 => 请求体的上传是流式的
7. GET 请求参数会被完整的保留在浏览器历史记录中 POST 不会
8. GET url 地址可以被存入书签, POST 不可以

综上, 看上去 GET 和 POST 天差地别, 但是实际上…根据 图解 HTTP .两者的请求报文完全一致🤔

两者的区别

1. === 为恒等符, 当两边的变量类型相等的时候进行对比, 值相等返回 true 不相等则返回 false
2. == 为等值符, 两边变量类型相同时直接比较是否相等, 否则会进行转化

转化规则

1. 如果一个是 null 一个是 undefined, 相等
2. 如果一个是字符串一个是数字, 把字符串转化成数字再比较
3. 如果一个是Boolean 那么把布尔值转化成数字再比较
4. 如果一个是对象, 另外一个是数字 or 字符串. 把对象转成原始值在比较
5. 其他类型的都不相等

对象转原始值其实就是调用其Symbol.toPrimitive, 你可以改写对象的这个方法参考: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Symbol/toPrimitive
默认情况下大多是优先调用自身的 valueOf 方法. 只有 Date 对象除外, 会优先调用 toString 方法

1. 浮动布局, 两端分别设置 float: left | float: right
2. 绝对定位布局, 三个盒子分别设置绝对定位
3. flex布局, 两边盒子设置宽度, 中间盒子设置flex: 1 实现宽度自适应
4. table 布局, 父级盒子设置 display: table, 三个子盒子分别设置 display: table-cell. 然后左右两个盒子分别设置宽度即可
5. 网格布局, 父级盒子设置 display: grid; grid-template-columns: 300px auto 300px;

1. 结尾添加空标签 clear: both
2. 父级设置高度
3. 父级设置 display: table
4. 父级设置 overflow: hidden | auto (同时需要设置 width 或者 zoom = 1, 且不能设置 height 靠浏览器自行检测即可)
5. 父级也设置浮动
6. 父级元素添加伪元素 :after {clear: both}