前端技术文章
-
用Element.prototype.matches()可精准隔离非业务区点击，通过预设选择器字符串匹配并向上遍历父元素，结合业务上下文和事件委托提升健壮性。236 收藏 -
Redash表格默认不渲染HTML，需改用Markdown可视化类型并确保SQL返回未转义的合法HTML或Markdown；字段值必须为<b>test</b>而非<b>test</b>，且仅支持<b><i><u><span>等白名单标签及color/background-color样式。251 收藏 -
SharedWorker依赖MessagePort端口通信，必须通过connect事件获取端口并显式调用port.start()；普通WebWorker直接使用postMessage/onmessage，无端口机制。二者必须严格隔离通信路径、消息协议与封装层，避免错发或监听丢失。206 收藏 -
exec族函数并非创建新进程，而是用指定程序完全替换当前进程的代码段、数据段和堆栈段；调用成功后原进程逻辑立即终止，PID保持不变，新程序从main函数开始执行。289 收藏 -
HTML本身没有后台代码，它只是前端标记语言；所谓“后台生成”实为混淆概念，用户真正需要的是HTML与后端技术（如Node.js、PHP、Flask）联动，或通过工具生成含表单提交、API调用能力的页面骨架。391 收藏 -
SharedArrayBuffer无法直接同步DOM对象，只能通过共享轻量元数据（如ID、坐标、状态标志等）实现高速同步；主线程与Worker各自维护DOM映射，借助定长结构体、原子操作和双缓冲协议协作，避免序列化开销，延迟可达亚毫秒级。465 收藏 -
用CSS自定义属性映射状态颜色的正确做法是：先通过属性选择器（如[data-state="error"]）声明--state-color等变量，再在通用规则中用var(--state-color)消费，实现状态与样式的解耦和集中维护。244 收藏 -
设body背景无效主因是高度不足、默认margin和层叠覆盖；需设margin:0、min-height:100vh，优先用html背景控制视口，注意深色模式干预与background简写清空规则。196 收藏 -
用Set实现高性能权限校验，依托其唯一性和O(1)has()查询，适用于前端路由守卫、按钮显隐等场景；初始化时将后端数组转为Set，多角色权限用展开运算符合并，动态更新需批量操作并配合响应式方案。105 收藏 -
inset是CSS定位复合属性，仅对position为absolute、fixed或sticky的元素生效；语法类似margin，支持1–4个值映射top/right/bottom/left，需配合定位上下文使用且不兼容旧版Safari。303 收藏 -
一键夜间模式核心是用CSS变量定义两套主题色，通过JS切换data-theme属性值并读取localStorage持久化，优先用户选择、其次系统偏好，配合合理transition避免闪烁，确保所有元素都使用var()取值。376 收藏 -
不行，浏览器不支持直接用<img>标签轮询RTSP/RTMP流；必须通过流媒体服务转成HLS（.m3u8）或WebRTC等浏览器可解码格式，或使用海康WebComponents等官方SDK实现。377 收藏 -
:has()伪类兼容性有限，Chrome105/Firefox103/Safari16.4起支持，旧版本静默失效；不支持伪元素和状态伪类；构建工具可能误删；JS监听+class切换更可靠。319 收藏 -
使用CSSGrid和媒体查询可高效创建响应式广告位：先用Grid定义多列布局，再通过媒体查询在小屏下调为双列或单列，结合minmax()实现弹性列宽，使广告自适应不同设备，同时注意图片适配与性能优化。376 收藏 -
答案：处理CSS浮动中文本对齐需清除浮动、触发BFC解决塌陷、设置text-align对齐文本，推荐用Flex布局替代。342 收藏