2024年12月17日
能不能实现图片懒加载？
摘要： 方案一:clientHeight、scrollTop 和 offsetTop 首先给图片一个占位资源: <img src="default.jpg" data-src="http://www.xxx.com/target.jpg" /> 接着，通过监听 scroll 事件来判断图片是否到达视口: l 阅读全文
posted @ 2024-12-17 17:08 ^柒 阅读(5) 评论(0) 推荐(0) 编辑
能不能实现事件的防抖和节流？
摘要： 节流 节流的核心思想: 如果在定时器的时间范围内再次触发，则不予理睬，等当前定时器完成，才能启动下一个定时器任务。这就好比公交车，10 分钟一趟，10 分钟内有多少人在公交站等我不管，10 分钟一到我就要发车走人！ 代码如下: function throttle(fn, interval) { le 阅读全文
posted @ 2024-12-17 17:06 ^柒 阅读(12) 评论(0) 推荐(0) 编辑
2024年12月16日
谈一谈你对重绘和回流的理解
摘要： 我们首先来回顾一下渲染流水线的流程: 接下来，我们将来以此为依据来介绍重绘和回流，以及让更新视图的另外一种方式——合成。 回流 首先介绍回流。回流也叫重排。 触发条件 简单来说，就是当我们对 DOM 结构的修改引发 DOM 几何尺寸变化的时候，会发生回流的过程。 具体一点，有以下的操作会触发回流: 阅读全文
posted @ 2024-12-16 16:47 ^柒 阅读(29) 评论(0) 推荐(0) 编辑
2024年12月13日
说一说从输入URL到页面呈现发生了什么？——网络篇
摘要： 这是一个可以无限难的问题。出这个题目的目的就是为了考察你的 web 基础深入到什么程度。由于水平和篇幅有限，在这里我将把其中一些重要的过程给大家梳理一遍，相信能在绝大部分的情况下给出一个比较惊艳的答案。 这里我提前声明，由于是一个综合性非常强的问题，可能会在某一个点上深挖出非常多的细节，我个人觉得学 阅读全文
posted @ 2024-12-13 16:58 ^柒 阅读(13) 评论(0) 推荐(0) 编辑
说一说浏览器的本地存储？各自优劣如何？
摘要： 浏览器的本地存储主要分为Cookie、WebStorage和IndexedDB, 其中WebStorage又可以分为localStorage和sessionStorage。接下来我们就来一一分析这些本地存储方案。 Cookie Cookie 最开始被设计出来其实并不是来做本地存储的，而是为了弥补HT 阅读全文
posted @ 2024-12-13 16:47 ^柒 阅读(51) 评论(0) 推荐(0) 编辑
2024年12月12日
说一说浏览器缓存
摘要： 缓存是性能优化中非常重要的一环，浏览器的缓存机制对开发也是非常重要的知识点。接下来以三个部分来把浏览器的缓存机制说清楚： 强缓存 协商缓存 缓存位置 强缓存 浏览器中的缓存作用分为两种情况，一种是需要发送HTTP请求，一种是不需要发送。 首先是检查强缓存，这个阶段不需要发送HTTP请求。 如何来检查 阅读全文
posted @ 2024-12-12 18:03 ^柒 阅读(25) 评论(0) 推荐(0) 编辑
2023年5月17日
element 去掉数字输入框的加减按钮
摘要： .el-input__inner { -moz-appearance: textfield; // 谷歌 去掉数字输入框的加减按钮 &::-webkit-outer-spin-button, &::-webkit-inner-spin-button { -webkit-appearance: non 阅读全文
posted @ 2023-05-17 11:14 ^柒 阅读(232) 评论(0) 推荐(0) 编辑
数字输入框
摘要： 直接上代码 <el-input type="number" placeholder="请输入" class="number" @blur="numberInputBlurHandle($event)" v-model.number="gptFormModel.count" :max="30" :mi 阅读全文
posted @ 2023-05-17 11:11 ^柒 阅读(20) 评论(0) 推荐(0) 编辑
2023年3月1日
树的先序遍历
摘要： export function preOrderTraversal(nodes, callback = () => { }) { // 先确保传入数据数组 if (!Array.isArray(nodes)) return for (const node of nodes) { const ret 阅读全文
posted @ 2023-03-01 16:42 ^柒 阅读(22) 评论(0) 推荐(0) 编辑
输入框激活时自动获取焦点
摘要： /** * contenteditable 激活时自动获取焦点 * @param {*} nodeDom 需要激活DOM */ export function setContenteditableCursor(nodeDom) { let range if (window.getSelection) 阅读全文
posted @ 2023-03-01 11:14 ^柒 阅读(40) 评论(0) 推荐(0) 编辑
下一页
点击右上角即可分享
微信分享提示