-
响应式导航栏小屏不折叠的主因是媒体查询断点错误或flex-direction未生效;需确保max-width断点匹配设备、菜单容器设flex-direction:column且display:flex,checkbox联动逻辑正确,z-index配合position闭环。
-
用SassMap定义颜色系统应将语义化色名(如primary、warning)作为键,十六进制值为值存入$colors;支持嵌套主题Map,通过map-get分层取值;相比变量拼接,map-get类型安全、可校验、IDE可跳转,且键不存在时返回null而非报错。
-
data-属性非双向绑定,修改dataset会更新HTML但反之不成立;购物车需用data-id和data-price携带唯一标识与原始单价,读取后须parseFloat()转数字,修改后需手动同步DOM、内存和localStorage。
-
HTML不支持自动生成目录,需手动为h2/h3添加符合规范的id(小写、连字符、非数字开头、唯一),再用href链接;JS动态生成TOC须等DOM加载、安全转义文本、避免重排;CSS:target仅能高亮目标元素,:has()支持不稳,高亮导航项仍需JS。
-
HTML5规范明确支持UTF-8和UTF-16编码,其中UTF-8是强制要求必须支持的唯一编码,UTF-16为可选支持;其他如ISO-8859-1、GBK等虽被主流浏览器实际支持,但非HTML5规范强制要求。
-
应使用opacity与transform组合加transition实现平滑切换,避免display/height等触发重排的属性;配合transitionend监听或状态锁防止快速点击导致UI错乱;框架中宜用显隐控制而非卸载组件。
-
BEM通过.block__element--modifier命名规范显性化样式作用域,解决通用类滥用导致的覆盖混乱;改造需收口孤立样式类、扁平化嵌套、校验修饰符与元素命名,并用postcss-bem-linter自动约束。
-
本文介绍如何使用纯JavaScript实现基于多组复选框的精准产品筛选功能,支持在单个data-*属性中存储多个空格分隔值(如data-color="redwhiteblue"),并按“所有选中条件必须同时满足”的逻辑动态显示匹配的产品项。
-
移动端无hover状态,应使用:focus-within配合可聚焦链接实现兼容方案,并用visibility/opacity/pointer-events组合控制显隐与可访问性。
-
CSSGrid+aspect-ratio能纯CSS实现响应式图片瀑布流,关键在于原生支持aspect-ratio与grid-auto-flow:dense协同;需图片有明确宽高比、使用auto-fill列布局、启用dense填充、避免基线干扰,并通过占位防抖动、合理key控制渲染、Safari降级适配。
-
富媒体摘要必须使用JSON-LD格式的<scripttype="application/ld+json">,且结构化数据需与页面可见内容严格一致;Article类型须含headline、datePublished、author等字段,image须为可访问的数组,datePublished等日期须为带时区的ISO格式。
-
原型链污染是JavaScript中因不当处理对象属性导致的高危安全问题,攻击者通过控制输入向Object.prototype写入恶意属性,影响所有对象行为;其发生源于对象属性访问时沿原型链查找,若未防护地递归赋值用户可控数据(如JSON、URL参数),可能意外修改__proto__或constructor.prototype;常见触发点包括使用存在缺陷的深拷贝工具、手动递归赋值未过滤敏感键、直接解析含{"__proto__":{}}的JSON;防御核心是不信任任何输入,升级修复版本依赖、过滤敏感键名、采用
-
浮动元素脱离文档流导致父容器背景色无法撑开,根本解决方法是触发BFC:现代推荐display:flow-root(Chrome64+/Firefox58+/Safari15.4+),旧项目兼容IE可用.clearfix伪元素清除浮动。
-
链式调用要求每个方法返回this以维持调用链,需避免遗漏returnthis、构造函数返回新对象、异步中混用同步返回、this绑定丢失等问题。
-
IDE插件搜索支持JS正则核心语法,如元字符、分组、量词和转义,但命名捕获组、Unicode属性类等特性兼容性有限;实用场景包括定位未await的Promise、提取JSDoc参数、批量修改import路径等。