-
盒模型定义元素尺寸,浮动控制排列方向。元素实际宽度包含content、padding、border和margin,浮动时依据该总宽度向左或右排列,多个同向浮动元素依次贴靠,超出则换行;通过margin设置间距,需注意总宽度避免意外换行;父容器需清除浮动防止高度塌陷,常用clear属性或clearfix技巧解决;结合box-sizing:border-box更易控制尺寸。此组合实现传统横向布局与文本环绕,虽有Flex/Grid等新方案,但在旧项目中仍实用。
-
按钮动画卡顿可通过使用transform和@keyframes优化,因transform由GPU加速,避免触发重排重绘;应采用scale、rotate实现动画,配合ease-in-out等缓动函数,并合理设置animation-duration与循环次数,必要时通过will-change启用硬件加速,提升流畅度。
-
HTML表格可通过五种方式实现:一、用table/th/td构建基础表格;二、用colgroup/col统一控制列样式;三、嵌套table展示层级数据;四、用CSSGrid模拟表格布局;五、用JavaScript动态生成表格。
-
虚拟列表通过只渲染可视区域内的元素来提升性能,解决大量数据导致的卡顿问题。其核心是计算可视窗口的起始索引、结束索引与顶部占位高度,动态更新内容并减少DOM节点数量。实现需固定容器高度、预估项目高度,并用占位处理保持滚动正常。常见参数包括startIndex、endIndex、offset和visibleCount。示例代码展示了基于scrollTop计算渲染范围的基本逻辑。实际开发中推荐使用react-window、vue-virtual-scroller等成熟库,支持变高、横向滚动、双向滚动及预加载功能
-
HTML5搜索框提示可通过四种方式实现:一、用title属性最简;二、用data-tooltip加CSS自定义样式;三、用JavaScript动态控制显示隐藏;四、用aria-label和aria-describedby增强无障碍支持。
-
webkit-playsinline是iOS10前私有属性,playsinline是标准属性,需同时设置才能兼容各版本;未静音、无用户交互、CSS变换、编码不支持等会导致内联失效;禁用全屏需监听webkitbeginfullscreen和fullscreenchange并调用对应退出方法。
-
批量提交多个表单数据可通过三种方式实现:一是使用JavaScript收集各表单数据并合并为FormData对象,通过fetch统一发送;二是将多个表单合并为一个大表单,直接提交避免嵌套;三是通过AJAX逐个异步提交各表单,利用Promise.all统一处理结果。选择方案需根据页面结构和业务需求权衡灵活性与复杂度。
-
柯里化是将多参函数转换为单参函数链的技术,核心在于分步传参而非一次性传递;它改变调用节奏但不改变逻辑,需手动实现或使用Lodash等库以应对占位符、rest参数等复杂场景。
-
Date对象是JavaScript处理时间的核心工具,基于Unix时间戳,支持本地和UTC时间操作,提供创建、读取、设置及格式化日期时间的多种方法。
-
JavaScript内存泄漏检测主要靠ChromeDevTools的Memory和Performance面板配合人工分析,核心是“对比变化、定位异常、追溯引用”,常见于未解绑事件监听器、未清除定时器、意外全局变量、闭包长期持有大对象、DOM被JS强引用五类高频场景。
-
rem布局本质是动态设置html根元素font-size,需JS监听DOM加载和屏幕变化实时计算并更新;须禁用用户缩放、避免CSS覆盖、用PostCSS自动转换px为rem,并统一flex属性单位。
-
video元素默认控制条无法换肤,必须禁用原生controls属性,通过HTML+CSS绘制控件并用JavaScript绑定播放、暂停、进度拖动等行为,同时注意跨浏览器兼容性与移动端交互细节。
-
苹果设备HTML5开发需兼顾Safari调试与XcodeWebView集成:一、启用SafariWebInspector远程调试iOS页面;二、Xcode中用WKWebView加载本地/远程HTML资源并调试;三、优化viewport、媒体内联播放、触摸事件及Webkit特性适配。
-
宽屏下内容太散的根本原因是容器默认随视口拉伸导致阅读动线过长;解决方法是用max-width限制主体宽度(如1024px)并配合margin:0auto居中,小屏不设、大屏分级控制,避免父容器flex/absolute/高优先级width干扰。
-
JavaScript会阻塞DOM构建,影响关键渲染路径;通过async或defer属性异步加载脚本,可避免解析阻塞;非关键JS应延迟加载或动态导入;确保DOM就绪后再访问元素,以提升首屏渲染速度和用户体验。