- 博客(11)
- 资源 (1)
- 收藏
- 关注
RSS订阅转载 [浏览器知识点] 重排/回流 重绘 合成
文章目录一、 [浏览器知识点] 重排/回流 重绘 合成1. 重排/回流2. 重绘3. 直接合成阶段二、减少重绘、重排一、 [浏览器知识点] 重排/回流 重绘 合成1. 重排/回流从上图可以看出，如果你通过 JavaScript 或者 CSS 修改元素的几何位置属性，例如改变元素的宽度、高度等，那么浏览器会触发重新布局，解析之后的一系列子阶段，这个过程就叫重排/回流。无疑，重排需要更新完整的渲染流水线，所以开销也是最大的。2. 重绘比如通过JavaScript更改某些元素的背景颜色，那么布局阶段不
2021-06-24 11:02:08
133
原创 手写promise.all
文章目录一、手写promise.all1. 具体代码一、手写promise.all先总结下promise.all用法的特点：接收一个 Promise 实例的数组或具有 Iterator 接口的对象，如果元素不是 Promise 对象，则使用 Promise.resolve 转成 Promise 对象如果全部成功，状态变为 resolved，返回值将组成一个数组传给回调只要有一个失败，状态就变为 rejected，返回值将直接传递给回调all() 的返回值也是新的 Promise 对象1
2021-06-22 14:54:53
2552
原创 三方SDK引用问题-【持续更新】
文章目录一、问题整理1. http://pingjs.qq.com/h5/stats.js?v2.0.4 net::ERR_BLOCKED_BY_CLIENT一、问题整理1. http://pingjs.qq.com/h5/stats.js?v2.0.4 net::ERR_BLOCKED_BY_CLIENT解决方案 :一般都是浏览器安装的某个第三方扩展程序已阻止对此网页的访问，禁用即可。...
2021-06-16 17:23:19
281
原创 yarn-工具【持续更新】
文章目录一、问题整理1. error Incorrect integrity when fetching from the cache一、问题整理1. error Incorrect integrity when fetching from the cache解决方案： yarn cache clean
2021-06-16 17:20:00
205
原创 经典布局-双飞翼
文章目录一、双飞翼布局1. 具体实现一、双飞翼布局产生的背景：针对圣杯布局的缺点，淘宝的工程署们提出了双飞翼布局，原理：在中间区域加一层dom节点，然后添加左右margin，实现三栏布局。1. 具体实现代码骨架：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content=
2021-06-09 22:24:05
446
原创 经典布局-圣杯
文章目录一、圣杯布局1. 什么是圣杯布局？或者说圣杯布局是解决什么问题？2. 具体实现3. 优化实现一、圣杯布局1. 什么是圣杯布局？或者说圣杯布局是解决什么问题？左右两边是个固定的宽度，中间自适应的三栏布局。2. 具体实现代码骨架：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible"
2021-06-09 17:19:03
226
原创 npm-相关
文章目录一、npm-初始化项目1. package.json初始化介绍2. 基本命令3. 版本区别二、 上传插件到npm仓库1. 具体步骤2. 注意三、一些区别1. npm与cnpm的区别2. npm与yarn的区别官网： https://docs.npmjs.com/一、npm-初始化项目1. package.json初始化介绍# 使用npm默认package.json配置npm init -y# 或者使用交互式自行配置，遇到选项如果直接敲回车即使用括号内的值npm init# 控制台信息
2021-06-09 10:55:13
207
转载 font-size: 0的作用和用途
文章目录1. 解决表格之间空隙2. 解决图片之间的空隙3. 解决行内元素空隙多种方法解释：font-size: 0 不是指字体大小是0px代码自动格式化的时候，往往会设置一些适当的缩进、换行，但当元素的display为inline或者inline-block的时候，这些缩进、换行就会产生空白，导致前端页面展示变形。1. 解决表格之间空隙以ul和li为例：最合适的方法就是给li的父级ul设置： font-size: 0;给li设置：font-size: a px; 如此就达到了所需效果，
2021-06-08 17:22:14
787
原创 前端安全-持续更新
一、常见的web前端攻击方式有哪些？1. XSS 跨站请求攻击[Cross Site Scripting]通俗解释在网站上注入自己的javascript脚本，执行非法操作。简易场景一个博客网站，我发表一篇博客，其中嵌入2. XSRF 跨站请求伪造[Cross-site request forgery]通俗解释跨站伪造用户的请求，模拟用户的操作。简易场景用户正在购物，看中的某个商品，商品id是100付费接口是xxx.com/pay?id=100,但是没有任何验证
2021-06-08 10:47:53
73
转载 css使用padding-bottom百分比进行提前占位，防止抖动
文章目录一、css使用padding-bottom百分比进行提前占位，防止抖动。1. 页面加载抖动问题一、css使用padding-bottom百分比进行提前占位，防止抖动。1. 页面加载抖动问题在html5开发网页中，经常会遇到这样一个问题，比如一个宽度百分百，高度自适应的图片，在网速慢的情况下加载过程中会出现抖动的问题（未加载图片前容器的高度为0，图片加载完成后下面的内容会被挤下去）。这种问题如果是图片有固定高度，就不会出现加载抖动。但一般情况下，为了使图片不被拉伸，高度一般设为自适应，那
2021-06-04 10:45:00
1567
转载 3分钟搞定CSS的4种引入方式
文章目录一、3 分钟搞定 CSS 的 4 种引入方式一、3 分钟搞定 CSS 的 4 种引入方式在 HTML 样式中有 4 种 CSS 引用方式，分别为：行内样式（行间样式、内联样式、行嵌样式）、内部样式、链入外部样式、导入外部样式。行内样式（行间样式、内联样式、行嵌样式）： 在网页元素上通过 style="" 属性直接写样式。如：<div style="color: green; margin-top: 30px;border: 1px solid red;width: 500px">
2021-06-02 16:05:30
161
SugarNMSTool
2024-01-24
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人