-
em单位是相对于当前元素的字体大小计算的，但在实际应用中受父元素影响。1.em单位在响应式设计中非常有用，能随父元素变化。2.使用em可保持不同屏幕尺寸上的文字可读性。3.嵌套元素的计算复杂时，可用rem单位避免问题。4.根据需求灵活选择em和rem，CSS预处理器有助于管理em值。通过合理使用em，可以创建更具响应性和可读性的网页设计。
-
要通过JS在HTML中实现拖拽功能，核心在于设置draggable属性并监听dragstart、dragover和drop事件。具体步骤如下：1.给需要拖拽的元素添加draggable="true"属性；2.使用JavaScript监听dragstart事件，并通过event.dataTransfer.setData()设置拖动数据；3.在目标元素上监听dragover事件并调用event.preventDefault()以允许放置；4.监听drop事件，获取拖动数据并通过appendChild等操作完成
-
在JavaScript中，可以通过addEventListener方法为元素添加事件监听器。1）基本用法：通过addEventListener为元素添加事件监听器，如点击事件。2）多监听器支持：与onclick不同，addEventListener可以为同一个事件添加多个监听器。3）事件委托：通过在父元素上添加监听器来处理动态生成的子元素。4）移除监听器：使用removeEventListener避免内存泄漏。5）最佳实践：使用箭头函数保持this上下文。
-
在用Vue.js开发电商网站时，需要考虑以下关键点：1.组织项目结构，利用组件化特性拆分网站；2.使用Vuex集中管理状态，如用户信息和购物车内容；3.优化性能，考虑使用SSR提升首屏加载速度；4.处理用户登录状态，结合JWT实现无状态认证；5.使用自定义指令增强用户交互，如实现商品图片懒加载；6.进行单元测试和集成测试，确保代码质量和稳定性。
-
在HTML中实现中文段落两格缩进可以通过CSS的text-indent属性实现。具体方法是：1.使用p{text-indent:2em;}实现两格缩进，2em相当于两个汉字宽度。2.确保在不同设备和浏览器上的一致性，可以选择em单位或px单位。3.处理段落内嵌套元素时，可使用pimg,pblockquote{text-indent:0;}重置缩进。
-
实现移动端长按事件的核心方法是监听touchstart、touchmove和touchend事件，并通过setTimeout和clearTimeout控制触发时机；1.在touchstart中记录起始时间并设置定时器；2.在touchmove中判断移动距离，若超出阈值则清除定时器以避免误触；3.在touchend中判断时间差，决定触发长按或短按；优化体验可通过调整长按阈值、使用requestAnimationFrame提高精度及加入移动容错范围来减少误判；在React或Vue等框架中，可结合状态管理和组件
-
在Vue组件中，props用于接收父组件传递的数据，data用于管理组件内部状态。使用props的情况包括：1.数据来自父级组件；2.需要根据外部变化调整行为；3.多个实例共享配置信息；使用data的情况包括：4.存储UI状态；5.表单绑定；6.不需暴露的数据。注意不要直接修改props，应通过$emit通知父组件更改；data必须是返回对象的函数以确保独立性。可以将props赋值给data初始化状态，或通过watch监听props变化并更新内部数据。常见误区包括重复声明props、直接修改props，建
-
创建CustomEvent对象，2.使用dispatchEvent触发事件，3.通过addEventListener监听事件。HTML5的CustomEvent允许创建自定义事件以实现组件间解耦通信，其核心步骤包括：首先使用newCustomEvent创建事件并设置detail、bubbles、cancelable参数，其中detail用于传递数据，bubbles控制事件是否冒泡，cancelable决定事件是否可取消；然后通过dispatchEvent方法在指定DOM元素上触发该事件；最后使用addEv
-
要让页面进入全屏显示，主要依赖浏览器提供的FullscreenAPI，通过调用目标元素的requestFullscreen()方法实现。1.首先需获取目标元素（如document.documentElement）并绑定用户触发事件（如按钮点击），确保全屏请求由用户主动行为发起；2.在事件处理函数中判断当前是否处于全屏状态，分别调用requestFullscreen()或exitFullscreen()方法，并兼容不同浏览器的前缀实现；3.监听fullscreenchange事件以响应全屏状态变化，同时监听
-
aria-busy适用于动态内容区域以提升可访问性，其使用场景包括异步加载内容、表单提交状态更新、实时数据刷新仪表板。1.异步加载内容区域：如无限滚动列表、AJAX表格或图表更新时，通过设置aria-busy="true"防止屏幕阅读器读取不完整信息；2.表单提交后的状态提示：在提交过程中标记相关区域为忙碌，避免用户误解；3.实时数据仪表板：在数据频繁更新时短暂标记忙碌以确保播报准确性。与aria-live协同时，先设aria-busy抑制过早播报，待内容稳定后移除busy属性触发live播报。正确使用需
-
Flexbox是一种用于构建响应式界面的CSS布局模式，其核心在于容器和项目。1.通过设置display:flex或inline-flex创建flex容器；2.使用flex-direction控制排列方向；3.justify-content设置主轴对齐方式；4.align-items设置交叉轴对齐方式；5.flex-wrap控制是否换行；6.flex属性控制伸缩行为。它是一维布局，适合单行或单列的灵活排布，与Grid的二维布局不同，更适用于简单响应式结构，结合媒体查询可实现不同屏幕下的自适应排列，且现代浏
-
display属性决定HTML元素的盒子类型及布局行为，block独占一行可设宽高，inline随文本流仅占内容宽且宽高无效，inline-block兼具inline的并排特性和block的盒模型控制；2.响应式中通过display:none隐藏元素节省空间，flex和grid则实现不同屏幕下子元素排列方向或网格结构的切换；3.高级用法如table系列模拟表格布局，list-item生成列表标记，contents使子元素直接受父容器布局管理，但需注意inline垂直间距、inline-block间隙、di
-
处理异步函数的超时中断，核心在于引入时间限制机制以主动终止未完成的操作，避免资源占用或程序卡死。1.使用Promise.race模式：通过让异步操作与定时器Promise赛跑实现超时判断，若定时器先完成则返回超时错误，但此方法无法真正中断底层操作，仅在逻辑上“忽略”结果；2.使用AbortController：提供真正的取消机制，适用于支持AbortSignal的API（如fetch），能中止底层操作并释放资源，需在自定义函数中监听signal.aborted状态以执行清理逻辑。两者适用场景不同：Prom
-
HTML表格数据实现本地存储的核心技术包括localStorage、sessionStorage和IndexedDB。1.localStorage适合数据量小、结构简单的场景，如用户偏好设置或小型数据缓存，通过JSON.stringify()序列化数据后存储；2.sessionStorage用于临时性数据，如多步表单中的页面状态，关闭标签页后自动清除；3.IndexedDB适用于数据量大、需复杂查询的场景，支持异步操作、事务处理和索引查询，能高效管理结构化数据；4.其他方案如ServiceWorkers结
-
JavaScript操作NFC主要通过WebNFCAPI实现，需在HTTPS安全上下文下由用户手势触发，使用NDEFReader对象读写NDEF格式数据；2.读取标签需创建NDEFReader实例，监听onreading事件并调用scan()方法；3.写入数据通过write()方法将包含文本、URL等记录的消息写入标签；4.可调用makeReadOnly()方法将标签设为只读；5.该API不支持低级APDU命令、NFC卡模拟、点对点通信及后台扫描；6.浏览器支持有限，主要适用于Android的Chrome
