- 博客(1007)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 van-pull-refresh 在app内嵌的h5 头部为固定定位时，每首次进入页面时，页面都会向上自动滚动一部分
/ 使用 nextTick 确保 Vue 的 DOM 更新已经完成。// 计算容器的最小高度，例如：视口高度 - 头部高度。/* 同时设置高度为100%视口减去头部高度 */// 方法3: 操作更外层的滚动容器（如果有）/* 设置顶部外边距，为固定头部预留空间 */// 方法1: 操作滚动容器元素 (更直接)// 方法2: 操作全局窗口 (备用方案)// 在组件挂载后，强制滚动到顶部。这是最直接有效的组合方案。/* 确保容器自身可以滚动 *//* 其他样式... */// 假设头部高60px。
2025-12-28 00:43:45
942
原创 在echarts图表上Y轴上面在各加两种类型并且每个上面分别有两条固定值的的且颜色相同的线
下面的代码演示了如何在一个双Y轴的图表上，为每个Y轴添加两条颜色相同的固定线。下面是一个清晰的配置示例和说明，可以帮助你快速实现需求。在ECharts中为Y轴添加固定值的参考线，可以通过配置。
2025-12-22 20:45:32
136
原创 uniapp vue3的ts页面初始化模板代码
这个模板涵盖了 UniApp Vue3 TS 页面开发的核心要素。在实际项目中，建议您根据业务逻辑调整数据、方法和样式。
2025-12-22 20:26:13
310
原创 vue3的ts页面初始化模板代码
在 Vue 3 中使用 TypeScript 开发时，主要有两种编写页面的方式。以下是两种风格的模板代码，你可以根据项目需求选择使用。这种写法更简洁，不需要显式返回数据，适合 Vue 3.2+ 版本，是目前的主流写法。函数，结构清晰，适合初学者和需要明确控制暴露内容的情况。
2025-12-22 20:24:42
223
原创 UniApp页面跳转后关闭原页面的完整指南：让应用流畅如丝
想象一下浏览网页：每次打开新网页，浏览器都会记录你的访问历史，你可以随时点击返回按钮回到之前页面。UniApp中的页面栈也是类似的概念，它像一个堆叠起来的盘子，每打开一个新页面，就往上面放一个盘子；返回时，就从顶部拿走一个盘子。理解了这一点，我们就明白为什么简单的跳转不能关闭原页面了——因为原页面还在“盘子堆”里！UniApp中跳转页面后关闭原页面不是单一方法就能解决的，需要根据具体场景选择合适方案。记住这个选择口诀普通页面替换用redirectTo底部导航切换用switchTab彻底重新开始用。
2025-12-17 16:48:41
294
原创 uniapp 实现路由切或者tab切换详细步骤
在 UniApp 中实现页面路由和标签页（Tab）切换是核心开发技能。下面为你梳理详细步骤和不同场景的实践方案。下面表格中帮助你快速了解 UniApp 中主要的页面跳转方式及其区别：最常用的跳转方式是 。在跳转时，可以通过URL传递参数。在目标页面，于 生命周期函数中接收参数：注意：通过URL传递的参数值会被转换为字符串类型，如有需要（如ID为数字），请在接收后进行类型转换 。使用 可以返回上一页面或多级页面。🏷️ 实现Tab切换在 UniApp 中，Tab 切换有两种主要形式：基于原生 T
2025-12-16 19:00:08
935
原创 vue 在列表展示中如何给单个卡片中的显示隐藏交互填加单独事件
Vue 是数据驱动的，控制显示隐藏的关键是为每个列表项数据绑定一个状态属性（例如 isShow 或 visible），然后通过模板指令（v-show 或 v-if）根据这个状态属性来渲染内容。• v-show 与 v-if 的选择：v-show 通过 CSS 控制显示隐藏，组件始终会被渲染，适合切换频繁的场景；• 添加过渡效果：使用 Vue 内置的 组件包裹内容，可以让显示隐藏的过程具有平滑的动画效果。• 同一时间只允许一个项展开（如手风琴菜单）：可以考虑使用单一激活索引/ID的方法。
2025-12-15 20:40:15
353
原创 unapp调用微信小程序接口
在 UniApp 中调用微信小程序接口，核心在于理解 UniApp 作为跨端框架所提供的统一API，以及如何在需要时直接使用微信原生能力。下面这个表格汇总了主要的接口类型和调用方式，可以帮助你快速概览。
2025-12-15 15:14:18
398
原创 在页面中使用 uni-icons 组件
你可以通过 HBuilderX 的插件市场直接导入，或者将插件复制到项目的。希望这份详细的指南能帮助你在 uni-app 中顺利使用。这是最常见的方式，直接将图标作为组件嵌入页面内容区。你还可以将图标配置到页面顶部导航栏的右侧按钮位置。// 导入 uni-icons 组件。在相应页面的 Vue 组件中，添加。中，找到对应页面的配置项，在。首先，确保你的项目中已安装。// 或您项目中的实际路径。// ... 其他代码。
2025-12-11 13:23:34
698
原创 如何使用 Proxy 实现函数参数类型校验？AbortController 如何中断未完成的请求？
面试官的笔尖在简历上停顿，眼镜片后的目光突然锐利起来：“请讲一下如何用Proxy实现函数参数类型校验？”你的大脑瞬间一片空白，像被清空的控制台。明明上周才看过Proxy的文档，此刻那些、、陷阱却像泥鳅一样抓不住。手心开始冒汗，你含糊地说了句"可以拦截函数调用…"，声音小得像蚊子叫。"那AbortController呢？"面试官不依不饶，“如何中断一个已经发出去但还没返回的请求？”完了，这个更没把握。你想起项目里用过fetch，但从没想过怎么中断它。支支吾吾的回答中，你看到面试官已经开始翻看 next 简历了
2025-08-01 13:04:55
1316
3
原创 如何使用 CSS 变量实现动态主题切换？
变量分层法则：区分基础变量（不随主题变）和主题变量（随主题变），基础变量放:root，主题变量按主题分组。口诀：“基础不变主题变，分层管理更清楚”命名语义化法则：变量名要反映用途而非具体值，比如用–color-primary而非–color-blue，这样换主题时变量名不用改。口诀：“名随功能变，不随颜色变”最小覆盖法则：新主题只定义与默认不同的变量，相同的变量让它自动继承，减少重复代码。口诀：“不同才定义，相同不重复”渐进增强法则。
2025-08-01 12:48:40
1085
原创 Web Components 的核心技术有哪些？如何封装一个带样式隔离的自定义按钮组件？
让你能创建真正属于自己的HTML标签，比如，就像给组件办理了唯一身份证。// 定义自定义元素super();// 组件的构造逻辑// 注册为<my-button>标签拥有生命周期回调，能监控组件的创建、插入、删除等过程支持自定义属性（props），如命名规范法则：自定义元素标签名必须包含连字符（如my-button而非mybutton），这是W3C的强制规定，也能避免与未来的原生标签冲突。同时建议使用项目前缀（如ali-button），进一步降低命名冲突风险。样式隔离法则。
2025-08-01 12:42:31
1219
原创 嵌套路由中activated早于mounted触发，如何用renderTracked钩子调试？useFetch()中未清除的AbortController如何通过effectScope统一管理？
顺序认知法则：牢记"子组件mounted早于父组件mounted"的反直觉顺序，放弃"父先子后"的固有思维。数据依赖法则：子组件绝不能在mounted/activated中直接使用父组件数据，必须通过watch或v-if等待数据就绪。renderTracked三问钩子执行顺序符合预期吗？数据在钩子执行时已经准备好吗？父组件和子组件的追踪记录有什么差异？条件渲染法则：对于依赖异步数据的UI，永远使用v-if做条件渲染，避免"白屏+错误"的糟糕体验。keep-alive双态法则。
2025-07-23 23:04:06
1320
8
原创 for await (const chunk of stream)处理10GB文件时，如何通过highWaterMark控制内存峰值？
类型适配法则：文本文件（日志、CSV）用小水位线（64KB-1MB），二进制文件（视频、压缩包）用大水位线（2-8MB）。因为文本文件换行符多，需要频繁切割；二进制文件可连续读取更大块。速度匹配法则：highWaterMark的值 ≈ 平均处理速度（MB/秒）× 0.5秒。例如处理速度是1MB/秒，水位线设为512KB最合适，确保缓冲区不会堆积。无缓存法则：绝对禁止在处理过程中缓存所有chunk（如push到数组），这会让流处理失去意义，回到全量加载的老路。需要中间结果时，应边处理边写入磁盘或数据库。
2025-07-23 22:35:19
1146
2
原创 @container style(--theme: dark)嵌套@media (prefers-color-scheme: dark)导致死循环，如何通过CSS变量隔离解决？
凌晨两点，咖啡杯底最后一口冷掉的液体泛着苦涩，你的鼠标指针在DevTools的Elements面板上疯狂闪烁。控制台里"Layout was forced before the browser could paint"的警告像永不熄灭的警灯，页面在白与黑之间抽搐——这不是恐怖片场景，而是同时用了@container和@media深色模式查询的前端开发者的日常。作为写了8年代码的老油条，我太懂这种感受了：明明单独写容器查询没问题，单独写深色模式也跑得顺，怎么嵌套在一起就成了死循环？浏览器像个调皮的孩子，你让它
2025-07-23 22:15:55
749
1
原创 ＜link rel=“preconnect“＞与dns-prefetch同时使用时如何避免重复请求？优先级计算规则是什么？
在前端性能优化中，和dns-prefetch是很实用的工具，但同时使用时要注意避免重复请求。关键在于根据资源的优先级来选择合适的标签：高优先级资源用preconnect，低优先级资源用dns-prefetch。它们的优先级由资源重要性、是否跨域和在HTML中的位置共同决定。掌握这些知识，能让我们更好地利用这两个标签提升页面加载速度，改善用户体验。
2025-07-23 22:09:59
1045
2
原创 Vue2 的响应式原理中，Object.defineProperty的局限性是什么？如何实现 Vue 组件的懒加载？Vue3 的 Suspense 组件有什么作用？如何处理异步数据加载？
在本文中，我们深入探讨了Vue中的四个重要概念：Vue2响应式原理中Object.defineProperty的局限性、Vue组件的懒加载实现、Vue3的Suspense组件的作用以及异步数据加载的处理方式。通过对这些概念的原理分析、代码示例和对比说明，我们可以看到Vue在不断发展和完善：从Vue2使用Object.defineProperty实现响应式，到Vue3改用Proxy，解决了许多响应式检测的局限性，让开发者能更自然地操作对象和数组。
2025-07-22 14:47:29
828
6
原创 在JavaScript中 Promise、Generator、Async/Await 的区别与应用场景？
专业回答Promise是ES6引入的异步编程解决方案，它代表一个异步操作的最终完成（或失败）及其结果值。Promise有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败），状态一旦改变就不可逆。Promise主要解决了回调地狱的问题，通过链式调用的方式，让多个异步操作的代码变得扁平易读。同时，它也统一了异步操作的处理方式，提供了更优雅的错误处理机制。大白话回答Promise就像是外卖订单，你下单后不需要一直盯着商家，他们做好了会给你送过来。
2025-07-22 14:37:53
828
原创 CSS 盒模型有哪几种？它们的区别是什么？如何实现元素的垂直水平居中？
盒模型记住两句话：默认是标准盒模型（width=内容），加box-sizing: border-box就是IE盒模型（width=内容+内边距+边框）。垂直水平居中首选Flex（兼容性好）和Grid（代码少），未知宽高用定位+transform，老项目用table-cell。/* 全局设置IE盒模型，前端工程化最佳实践 */margin: 0;padding: 0;
2025-07-22 14:07:06
613
原创 HTML5 语义化标签的实际应用场景有哪些？DOCTYPE html 的作用是什么？
对机器友好：搜索引擎、屏幕阅读器这些"程序"能看懂你的页面，带来更好的SEO和可访问性对人友好：同事（包括未来的你）能快速理解代码结构，减少"这谁写的烂代码"的吐槽对未来友好：符合Web标准的发展方向，等Web3.0来了也不容易过时“见名知意，按需使用”。别为了语义化而语义化，比如明明就一个简单的小图标，非要用<figure>包起来，那就是画蛇添足了。写到这里，突然想起刚入行时的一件事：我第一次独立做项目，把所有内容都用<p>标签包起来，结果UI走查时被骂惨了——“这标题怎么和正文一个样？
2025-07-22 13:56:18
1025
原创 在React中的生命周期方法有哪些，在一个组件加载过程中这些生命周期都干了些什么，在项目中你常用到的生命周期方法有哪些？
React生命周期就是组件从创建、渲染到更新、卸载的整个过程中，会自动触发的一系列方法的集合。你可以把它想象成一个人从出生、长大、变老到死亡的一生，每个阶段都有特定的事情要做，组件也一样，每个生命周期方法都有它该干的活儿。React生命周期是组件从创建到销毁过程中一系列自动触发的方法，分为挂载、更新和卸载三个阶段。
2025-07-21 22:03:39
1126
2
原创 Vue 的响应式原理是什么？v-if 和 v-show 的区别是什么？Vue3 的 Composition API 有什么优点？
通过上面的讲解，我们对Vue的响应式原理、v-if和v-show的区别以及Vue3的Composition API的优点有了清晰的认识。Vue的响应式是Vue的核心特性之一，Vue2用Object.defineProperty，Vue3用Proxy，各有特点，Vue3的实现更完善。v-if和v-show虽然都是控制显示隐藏，但实现方式和适用场景不同，v-if适合不常切换的情况，v-show适合频繁切换的情况。Composition API让Vue的代码组织和逻辑复用更上一层楼，特别适合复杂项目。
2025-07-21 21:57:38
844
原创 在JavaScript中 什么是三元表达式？“三元”表示什么意思？“...”表示什么意思？.
三元表达式（Ternary Expression）是JavaScript中唯一需要三个操作数的条件表达式，就像快餐店里的“套餐选择”：你选A餐还是B餐？选A就给你汉堡，选B就给你炸鸡。条件?表达式1 : 表达式2如果条件成立，就执行表达式1，否则执行表达式2。这就像你下班回家纠结吃什么：“冰箱里有菜吗？有就做饭，没有就外卖”——一句话搞定原本需要好几句if-else才能说清的判断。在JavaScript中，...被称为扩展运算符（Spread Operator）或剩余运算符（Rest Operator）
2025-07-21 21:50:40
1075
原创 在CSS中rgba()和 opacity 的透明效果有什么不同？
你盯着屏幕上那个半透明的弹窗欲哭无泪。明明只想让背景模糊一点，给加了，结果弹窗里的按钮、文字、图片全都跟着变透明，就像被蒙上了一层毛玻璃；换成，背景确实透明了，可文字却清晰得刺眼，和设计稿上的“整体朦胧感”完全不符。这场景是不是像极了加班到凌晨时的偏头痛——明明只想缓解一个症状，却引发了一串连锁反应。前端开发者面对透明效果时，rgba()和opacity就像两片功效相似却副作用不同的止痛药，用对了药到病除，用错了雪上加霜。当设计师指着原型图质问：“为什么这个卡片的阴影透明度不对？”“为什么弹窗里的表单字看不
2025-07-21 21:39:40
1310
原创 行内元素和块级元素的具体区别是什么？行内元素的 padding 和 margin 可设 置吗？什么是外边距重叠？重叠的结果是什么？
凌晨三点，你盯着屏幕上混乱的布局欲哭无泪。明明给加了，刷新后却毫无反应；两个并排摆放，怎么调都像两个互不相让的壮汉，非要各占一行；给标签加了，它却像生了根似的纹丝不动，旁边的元素反而被挤得老远。这场景是不是似曾相识？就像加班到头痛欲裂时，急需一片布洛芬缓解不适，前端开发者面对布局混乱时，也急需搞懂行内元素和块级元素的“脾气”。当产品经理指着原型图问：“为什么这个按钮不能和文字并排？”“为什么这个图标加了边距却没效果？”你才发现，那些看似基础的元素特性，其实是布局的“隐形地基”。不懂这些，写CSS就像在流沙上
2025-07-21 21:25:38
1100
1
原创 vue2和vue3 实现数据双向绑定的原理详解，vue2和vue3 组件传值详解，vue2和vue3的生命周周期中都进行了什么事情详解？
vue2和vue3在双向绑定、组件传值和生命周期方面都有不少差异，但核心思想是一致的，都是为了更好地实现数据驱动视图，提高开发效率。双向绑定上，vue3的Proxy相比vue2的Object.defineProperty，能监听更多类型的变化，性能更好，使用更灵活。这意味着在开发中，我们可以更自由地操作数据，不用担心数据变化无法被监听。组件传值方面，vue3在vue2的基础上进行了优化，子传父需要声明事件，更规范；兄弟传值推荐用mitt；全局状态管理用pinia，这些变化让代码更易维护，团队协作更顺畅。
2025-07-20 14:57:59
1052
1
原创 在JavaScript 如何阻止事件冒泡和事件默认行为？
事件冒泡和默认行为是JavaScript事件处理中的两个核心概念，理解并掌握它们的控制方法，是写出流畅交互的前提。事件冒泡就像水中涟漪，会从触发点向上扩散，能有效阻止这种扩散，避免父元素的事件被误触发。这在处理嵌套元素的交互（如弹窗、下拉菜单）时特别重要，能防止“点A触发B”的乌龙事件。浏览器的默认行为是把双刃剑，方便了基础交互却限制了自定义需求。就像一把“总开关”，能禁用这些预设动作，让我们自由实现表单验证、自定义链接跳转等功能。事件对象是基础，必须正确获取和传递现代项目优先用和。
2025-07-20 14:42:43
1054
原创 CSS和CSS3 都有哪些选择器？
你盯着屏幕上混乱的样式欲哭无泪。产品经理在群里催：“首页的按钮样式怎么和详情页的混在一起了？赶紧改！”你看着代码里一堆`.btn`的样式，根本分不清哪个对应哪个，改了一个，其他地方全乱了。这已经是本周第五次因为选择器用错而加班了。作为前端工程师，我们每天都在和CSS选择器打交道。但你是否也曾遇到过这样的情况：想改某个列表项的样式，结果所有列表都跟着变；用了复杂的后代选择器，结果页面加载变慢；看到别人写的`:nth-child(2n+1)`一脸懵，不知道怎么实现隔行变色。别以为选择器只是“选元素加样
2025-07-20 13:45:58
853
原创 img 的 alt 与 title 有何异同？ strong 与 em 的异同？
产品经理发来紧急消息：“用户反馈APP里的图片加载失败时，一片空白太难看了，赶紧优化！”你打开代码一看，`<img src="logo.png">`里既没有alt也没有title，瞬间明白问题所在。刚改完这个，测试又提了个bug：“文章里的‘紧急通知’没有加粗，用户看不出来重点！”你瞅了瞅代码里的`<em>紧急通知</em>`，无奈摇头——这已经是本周第三次把strong和em弄混了。作为天天跟HTML打交道的前端人，我们总觉得“标签属性”就是写上去就行的小事。但现实是：当SEO优化师拿着检测报告说“
2025-07-20 13:34:20
811
原创 在 React 中 refs 的作用是什么？ keys 的作用是什么？state与props的有什么区别?
React中的refs、keys、state和props，就像组件的“四大护法”，各司其职又相互配合，共同支撑着React应用的正常运行。refs是“动手派”，负责那些必须直接操作DOM的脏活累活，但要记住“能不动手就不动手”，优先用数据驱动。keys是“身份证管理员”，在列表渲染时给每个元素发身份证，确保React不会认错人，避免状态错乱。state是“内部管家”，管理组件自己的可变状态，通过setState发号施令，驱动组件更新。props。
2025-07-19 14:16:11
1155
4
原创 在vue中如何在不使用浏览器刷新情况下，刷新当前页面，不要出现加载动画？
在Vue中实现“隐形刷新”，就像医生给病人做手术，既要解决问题，又要尽量减少创伤。核心就是抓住Vue数据驱动的特点，通过不同的方式让页面状态回到初始状态，同时不影响用户的操作体验。优先考虑状态重置：能通过重置数据解决的问题，就不要销毁组件或重新挂载路由，减少不必要的性能消耗。组件销毁重建要谨慎：如果组件有复杂的子组件或大量数据，频繁销毁重建会影响性能，这时可以考虑其他方法。路由参数要合理设置：用路由重新挂载时，参数要简单明了，避免设置过多或复杂的参数，增加维护成本。key值修改要适度：修改key。
2025-07-19 14:04:20
814
1
原创 JavaScript 中 pop ()、push ()、unshift ()、shift ()、split ()、join () 这些数组方法的作用、区别及使用场景
/ 定义一个存储购物车商品的数组let cart = ['苹果', '香蕉', '橘子', '西瓜'];console.log('原始购物车：', cart);// 输出：['苹果', '香蕉', '橘子', '西瓜']// 使用pop()方法删除最后一个元素console.log('被删除的商品：', deletedItem);// 输出：西瓜console.log('删除后的购物车：', cart);// 输出：['苹果', '香蕉', '橘子']
2025-07-19 14:02:31
836
原创 display:none 与 visibility:hidden 的区别是什么？
空间占用：display:none不占空间，visibility:hidden保留空间。性能影响：display:none触发回流（贵），visibility:hidden触发重绘（便宜）。使用场景：少切换用display:none（省内存），多切换用visibility:hidden（更流畅）。记住这3点，以后处理隐藏元素时就不会再踩坑了。
2025-07-19 13:57:13
776
原创 请简单说一下 src 与 href 他俩有什么区别？
上周帮新来的实习生改bug，屏幕上赫然一行红色报错：`GET http://localhost:8080/logo.png 404`。我点开代码一看——`<img href="./logo.png">`，当时差点把手里的咖啡泼键盘上。“哥，我明明路径没错啊，为啥图片就是不出来？”实习生挠着头，黑眼圈比我熬夜改React项目时还重。这场景是不是特眼熟？咱前端er天天跟HTML标签打交道，`src`和`href`就像俩穿同款衣服的孪生兄弟，看着差不多，脾气却差了十万八千里。用错了，轻则图片不显示、脚本跑
2025-07-19 13:53:28
1149
原创 在React中 调用 setState 之后发生了什么？中 Element 与 Component 的区别是？在什么情况下你会优先选择使用 Class Component 而不是 Functional
嘿，屏幕前的前端战友们！是不是经常在面试时被React的几个经典问题问得哑口无言？比如面试官突然抛出"setState之后到底发生了啥"，你是不是瞬间大脑一片空白，只能支支吾吾说个大概？别慌，这篇文章就是你的"救星"。作为一名摸爬滚打多年的前端老鸟，我太懂这种感受了。每天和React打交道，写着JSX，用着Hooks，调着setState，但真要深究底层原理，还真不一定能说清楚。今天，咱们就来好好聊聊这几个让无数前端工程师在面试中栽跟头的React核心问题。不管你是刚入行的萌新，还是有几年经验的老司
2025-07-18 11:22:27
1512
7
原创 在vue中 watch，computed，methods 的区别？
作为天天跟Vue打交道的人，我们总觉得`watch`、`computed`、`methods`就是“处理数据的三个工具”。但现实是：当设计师要求“用户名输入框实时显示剩余可输入字数，超过限制时自动截断”时，你写的`methods`在用户快速输入时出现卡顿——原来每次按键都触发计算，而你忘了`computed`的缓存特性。这篇文章不会讲那些“computed是响应式依赖缓存”的空话，而是掏心窝子跟你聊：为什么同样是处理数据，有人用`computed`实现的搜索过滤流畅如丝，有人用`methods`写的筛选
2025-07-18 11:20:27
1025
2
原创 JavaScript 的 typeof 返回哪些数据类型？请例举 3 种强制类型转换和 2 种隐式类型转换?
测试小姐姐发来截图：用户点击提交按钮后，表单提示“请输入数字”，但明明填了“123”。你打开控制台，输入`typeof document.getElementById('age').value`，结果赫然显示`string`——瞬间明白，又是该死的类型转换在作祟。隔壁工位的后端同事探过头：“这还不简单，加个`Number()`不就行了？”你苦笑一声，他不知道你上周刚因为`'1' == true`的隐式转换改到崩溃。作为天天跟`JavaScript`打交道的前端人，我们总觉得“类型转换”就是`Numbe
2025-07-18 11:10:31
963
原创 Sass、LESS 是什么？大家为什么要使用他们？.
你盯着屏幕上重复了27次的`#3e8e41`陷入沉思——产品经理突然要求把全站按钮的绿色从`#3e8e41`改成`#4caf50`，你不得不逐个打开15个CSS文件，在`button.css`、`card.css`、`form.css`里像找钥匙一样排查每个按钮的样式定义。当改到第8个文件时，手指已经开始机械性抽搐，而隔壁工位用Sass的同事只改了一个变量，喝着可乐看着你苦笑。作为天天跟`CSS`布局、`Flexbox`、`Grid`打交道的前端人，我们总觉得“写CSS”就是定义类名、写属性值而已。但现
2025-07-18 10:24:47
956
原创 你如何理解 HTML 结构的语义化？
你在急诊室般的上线现场疯狂回滚代码——测试小姐姐用屏幕阅读器浏览你们公司的官网，“关于我们”板块在她耳中变成了“div div span div”的乱码，而竞品的页面却能被清晰朗读：“这是公司简介，包含3个部分：发展历程、核心团队、企业愿景”。作为天天跟`HTML5`标签、`CSS3`布局、`JavaScript`交互打交道的前端人，我们总觉得“写对语义化标签”就是给`h1`到`h6`排好序、用用`<p>`标签而已。但现实是：当产品经理拿着低保真原型让你实现“左侧是主导航，中间是文章列表，右侧是推荐阅读
2025-07-18 10:10:32
665
原创 谈谈以前端角度出发做好 SEO 需要考虑什么？
你的Vue项目还在跟性能监控面板死磕——首屏加载3.2秒，老板在工作群里甩来竞品截图："同样做React单页应用，人家的关键词排名怎么就稳居前三？"作为天天跟`HTML5`、`CSS3`、`JavaScript`打交道的前端人，我们总觉得SEO是后端或运营的活儿。但现实是：当爬虫爬不到`SPA`里的动态内容，当`懒加载`图片变成搜索引擎眼里的空白，当`前端路由`跳转让页面权重分散——这些锅，最终还是得我们来背。这篇文章不会讲那些"meta标签要写全"的废话，而是掏心窝子跟你聊：前端工程师如何用`Vu
2025-07-18 09:10:10
518
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人