绕过中间商，不用 input 标签也能搞定文件选择
在本专栏的第一篇文章中，我们重新认识了 这位老伙计，挖掘了它的几个彩蛋特性。在做文件上传时，input 标签确实是我们的黄金搭档。但是为了方便调教 CSS 样式，我们往往需要把 input 标签藏起来，而用其他 HTML 元素来做 UI 代理。似乎是我们只馋 的身子，并不会给它一个名分 🐶。 但其实，不一定非要经过 input 标签这个中间商，我们是可以直接用 JavaScript 和系统进行文件交易的！ ！ 在上面的示例中，左侧是传...
LaTeX公式手册(全网最全)
如何插入公式 LATEX 的数学公式有两种：行中公式和独立公式（行间公式）。行中公式放在文中与其它文字混编，独立公式单独成行。 行中公式可以用如下方法表示： 独立公式可以用如下方法表示： 函数、符号及特殊字符 声调 / 变音符号 a˙,a¨,a´,a\ \check{a}, \breve{a}, \tilde{a}, \bar{a} \hat{a}, \widehat{a}, \vec{a} \exp a b = a^b, \exp b...
你能让网页也像QQ那种一样发出右下角消息吗
<span style="color: var( g headertextcolor);" 需求</span 很平常的一个工作日，「产品经理」给我发了个消息： 产品： 你能让网页也像QQ一样，来了消息能进行提示吗？我说的不是网页内的弹出消息 我： 刚搞完上个需求，别搞嗷，你小子 产品是一个比较随和的人，所以上面的对话比较随意；具体的聊天内容，我这里就省略了，跟他对话之后，他的大致需求如下： 页面中展示预警内容 检测到预警情况会通知用户且...
🪒Web端字体切割压缩方案
今天接到一个系统需求，需要将系统内的文字替换为鸿蒙OS的字体（ ），但是鸿蒙OS的字体单Regular的文件就有8M+。这个直接放到网页上，会极大影响使用体验。 于是乎，开始考虑怎么开始对字体文件进行压缩。 第一种方案 一般来说，字体格式体积由大到小排列（性能从差到好）： ttf，eot(IE8)，woff，woff2 从官网下载的鸿蒙字体是ttf格式的，尝试用了woff2格式的（ ），但是还是有4M多。对于Web端来说，还是太大了。...
H5 实现拍照选景框效果利用
背景 在实际项目中，遇到了需要唤起手机摄像头拍照的需求，最开始是通过 的方式，可以直接唤起手机相机，但是用户拍照的方向各式各样，导致后续业务处理时，没有达到预期的效果。 基于此，产品同学期望能在用户拍照时给用户一个引导框（也就是平时我们在用第三方证件拍照时的取景框效果）。经过讨论，给出了两种解决方案，一种是通过我们自研，先尝试看一下效果，第二种是使用第三方的 SDK，仅使用他们的拍照功能。 本文档仅涉及第一种，即通过我们自研的方式，实现...
封装一个H5照相机组件（放大缩小、连拍、预览、手电筒，横竖屏拍摄）
项目上有个需求就是说移动端网页中的照相机要支持连拍功能。 要知道咱们一般网页中通过input标签调用出来的照相机都是拍完后需要进行点击确认操作，然后再重新点击拍照按钮调起照相机如此往复，这样的交互方式对于需要快速拍摄照片的场景来说效率确实太低了。 如果本机摄像头无法进行连拍操作的话只能通过直接调用媒体摄像头的方式看看能否实现，考虑到开源的组件UI和交互方式可能无法满足项目需要且也不太好扩展功能所以觉得自己封装一个。 使用到的技术 Nav...
浏览器和nodejs事件循环（Event Loop）有什么区别
单线程和异步 JS是单线程的，无论在浏览器还是在nodejs 浏览器中JS执行和DOM渲染共用一个线程，是互斥的 异步是单线程的解决方案 1\. 浏览器中的事件循环 异步里面分宏任务和微任务 宏任务：setTimeout，setInterval，setImmediate，I/O，UI渲染，网络请求 微任务：Promise，process.nextTick，MutationObserver、async/await 宏任务和微任务的区别：微...
“同学，谈谈你对vue3 响应式原理的理解”
深入解析 Vue 3 的响应式原理涉及其核心实现细节和底层机制，主要包括 的使用、依赖收集与触发、以及性能优化策略。 1\. 响应式系统概述 Vue 3 的响应式系统基于 对象来实现数据的自动追踪和更新。 的主要作用是拦截对对象属性的操作（如读取、写入等），并允许开发者定义自定义行为。 2\. 响应式对象的创建 2.1 的使用 构造函数接收两个参数： 目标对象 ：即需要被代理的原始对象。 处理器对象 ：定义了一系列拦截操作的方法（如 、...
H5移动端-解决点击输入框时页面自动放大的问题
问题 在移动端项目，我们常遇到的一个问题：用户点击输入框时，页面会不期望地发生自动缩放，这既打断了用户的输入流程，也影响了整体的用户体验。 我们的目标是优化这一行为，确保用户在点击输入框时，页面能够保持稳定，仅允许用户专注于内容的输入，从而提升产品的可用性和满意度。 解决前后效果对比 方案 针对移动端点击输入框导致页面自动缩放的问题，我们需要根据不同操作系统（主要是安卓与iOS）采取差异化的解决方案。 安卓：通常可以通过在HTML文档头...