-
前端路由通过Hash或History模式实现SPA页面切换。Hash模式兼容性好但URL不美观;History模式URL简洁利于SEO,但需服务器配置支持。
-
应优先使用onMounted进行挂载后初始化,watchEffect适用于依赖响应式数据且需在数据就绪或变化时立即执行的初始化场景,二者职责不同、可共存。
-
掌握DevTools高级功能可显著提升前端调试效率。1.断点调试支持行断点、条件断点、DOM断点和事件监听断点,精准定位代码执行问题。2.Performance面板分析长任务、重排重绘及JS执行热点,结合UserTimingAPI识别性能瓶颈。3.Memory面板通过堆快照和内存分配时间线排查内存泄漏,查找未释放引用或detachedDOMtrees。4.Network面板支持禁用缓存、网络限速、XHR/fetch断点及请求拦截,模拟真实场景并调试异步逻辑。熟练运用这些功能可大幅提升开发效率。
-
customRef更适合防抖是因为它能手动控制track和trigger时机:输入时只track不trigger,防抖结束才trigger更新,避免中间值触发响应式副作用。
-
button标签比input按钮更推荐,因为它支持嵌套图片、图标和富文本内容,提供更强的样式灵活性、更好的可访问性和语义化,适用于现代网页中复杂UI和无障碍需求,而input按钮仅能显示纯文本且样式控制受限,因此在绝大多数场景下应优先选择button标签。
-
闭包是函数与其词法环境的组合,天然支持数据隐藏和完整性校验;通过封装私有状态、内聚校验逻辑、配合WeakMap模拟私有字段,提升前端代码健壮性与意图清晰度。
-
移动端:active触发时机因浏览器而异:Chrome在touchstart后立即触发,Safari等待touchend且禁止滚动/缩放,Firefox更保守;依赖它做核心交互不可靠,应改用JavaScript手动控制.is-pressed类。
-
五角星需用canvas通过极坐标转直角坐标计算5个顶点,按0→2→4→1→3→0顺序连线;先设中心(cx,cy)和半径r,角度从-π/2开始,用cos/sin算坐标,再moveTo+lineTo绘制并stroke/fill。
-
background-size和background-position可精准控制背景图的缩放与定位。使用cover或contain能使图像适配容器,结合center、top等定位值可实现居中或特定偏移,常用于全屏背景、雪碧图和响应式设计,提升视觉表现与布局契合度。
-
答案:HTML通过内联事件、DOM绑定、传参调用和页面加载自动执行等方式调用JavaScript函数。1.内联事件如onclick直接触发函数,适合简单场景;2.使用getElementById结合addEventListener实现结构与行为分离,利于维护;3.可在调用时传递参数,内联或闭包方式均可;4.通过DOMContentLoaded确保页面加载后执行初始化函数,避免元素未就绪问题。应根据项目规模选择合适方式,提升代码可读性与可维护性。
-
transition对display:none无效,因display是离散属性无法插值;应改用visibility+opacity组合实现淡入淡出,并注意z-index、position、pointer-events及transitionend过滤等实战要点。
-
table-layout:fixed会导致padding视觉上被截断,因列宽固定且内容溢出时挤压内边距区域;需配合box-sizing:border-box、word-break等属性保障其可见性。
-
答案:构建低延迟、高吞吐的实时HTML流处理系统需分四步:1.采集层用轻量HTTP或无头浏览器动态抓取,结合增量识别与分布式集群提升效率;2.解析层采用流式解析器与规则抽取,提取结构化数据并容错降级;3.流架构通过消息队列解耦,接入Flink等引擎做实时计算与多端输出;4.保障层实现重试、限速、监控与配置热更,确保稳定可靠。
-
应先判断焦点是否在可编辑元素内,再处理快捷键:检查document.activeElement的tagName是否为'INPUT'、'TEXTAREA'、'SELECT',并补充!event.target.isContentEditable判断;优先使用keydown而非keyup,及时触发并调用event.preventDefault()拦截默认行为;避开Alt键组合以防系统级冲突,Mac用metaKey、Windows/Linux用ctrlKey;快捷键面板需状态同步、aria-hidden控制可访问
-
<style>标签必须放在<head>内,紧贴<title>或<meta>后;它同步阻塞解析,不支持defer/async,语法同外部CSS但禁用@import和本地相对路径;优先级取决于特异性与顺序,内联style属性(1000)高于<style>中任何选择器(如p{}为1)。