-
Less中需用Mixin封装带参数的媒体查询,参数为断点键名而非字符串,通过map-get从@breakpoints映射取值,并加isdefined守卫;硬编码断点导致维护难、嵌套失效、单位混用;多条件查询需用@media(@conditions...)配合~"@{conditions}"拼接;应区分.media-up()与.media-down()以适配移动端或桌面端优先策略。
-
BroadcastChannelAPI是浏览器提供的同一源下跨标签页通信方案,通过创建同名频道实例实现消息收发,支持postMessage发送和onmessage监听,适用于状态同步与操作通知,需注意仅限同源、数据可序列化、不保证消息顺序,且应调用close()释放资源。
-
用@keyframes+animation实现可控闪烁纯CSS闪烁动画的核心就两步:定义关键帧、绑定到元素。别用text-shadow叠太多层模拟“发光”,容易糊且难调;优先走opacity或text-shadow的明暗变化,更轻量也更易控制节奏。常见错误是直接写animation:blink1sinfinite;却没定义@keyframesblink,浏览器直接忽略动画;或者忘了加animation-fill-mode:forwards;,导致动画结束后文字
-
transform居中更可靠,因margin:auto对绝对定位元素垂直方向无效,而translate(-50%,-50%)不依赖父高与子尺寸,且避免写死像素导致的错位。
-
JavaScript事件循环执行顺序取决于调用栈状态、任务队列及运行时实现;宏任务包括setTimeout、setInterval、setImmediate(Node.js)、I/O回调、UI渲染、postMessage、script脚本;微任务包括Promise.then/catch/finally、MutationObserver、queueMicrotask、async/await后续处理,且process.nextTick在Node.js中优先级最高。
-
-webkit-text-stroke是唯一被主流浏览器支持的文字描边方式,因原生text-stroke未标准化且未被任何引擎实现;Chrome、Edge、Safari支持该前缀属性,Firefox完全不支持,需搭配-webkit-text-fill-color:transparent使用,参数为widthcolor且顺序不可颠倒。
-
HTML导出本身不包含协作元数据,但第三方工具可能将data-collab-id等注入源码;需检查导出HTML中的data-*属性、注释及外链,禁用相关插件选项或手动清理。
-
掌握JavaScript设计模式进阶需理解对象、函数与闭包的灵活运用。1.创建型模式如工厂、抽象工厂、构造器和单例,解决对象创建的复杂性与解耦;2.结构型模式如装饰器、适配器和代理,优化类与对象的结构关系,提升扩展性;3.行为型模式如观察者、策略、迭代器和命令,规范对象间通信与职责分配;4.实际开发中常组合使用,如React的HOC体现装饰器思想,Redux融合观察者与命令模式。关键在于理解模式背后的问题本质,合理应用以提升代码可维护性,同时避免过度设计。
-
答案:优化JavaScript数组操作需减少遍历次数、避免频繁修改结构、预分配数组大小。应合并操作为单次遍历,优先使用push/pop,慎用unshift/shift,大数组可选for循环或工具库,明确长度时预创建数组以提升性能。
-
link标签必须写rel="stylesheet"且href为有效路径,推荐置于head中;路径以/开头表示根目录,否则相对HTML当前位置;加载顺序决定覆盖关系,后解析的样式优先。
-
CSS动画不会因遮挡或切页自动暂停,需用visibilitychange监听页面可见性或IntersectionObserver检测元素可视性来手动控制播放状态。
-
滚动进度条不能仅用CSS实现,因fixed元素width:100%相对于视口而非页面总高度,必须用JS监听scroll事件,结合requestAnimationFrame节流、缓存scrollHeight、处理iOSSafari兼容性及边界情况动态更新宽度。
-
深拷贝需根据场景选择方法:JSON方法简洁但不支持函数、循环引用等;手动递归可定制但复杂;结构化克隆支持多数内置对象但异步;Lodash最稳定但增加依赖。
-
本文介绍如何通过递归遍历DOM树,将任意HTML片段准确拆解为{text:"..."}和{markup:"<tag>"}交替排列的对象数组,避免正则陷阱与节点顺序错乱问题,适用于富文本解析、编辑器内容序列化等场景。
-
content属性不能直接插入图片,因其仅支持字符串、attr()、counter()及有限url(),且url()方式无法设置尺寸、定位等样式;应使用background-image配合display和宽高控制伪元素图片。