-
本文详解如何让网页拖拽功能兼容移动设备，解决原生drag/dropAPI在iOS/Android上失效的问题，并提供轻量级polyfill方案与最佳实践。
-
::selection伪元素可自定义用户选中文本的样式，如背景色、文字颜色和阴影效果。基本语法为::selection{background-color:#ff6347;color:white;}，可提升页面美观与体验。为兼容旧版浏览器，建议添加私有前缀：::-moz-selection{background:#00bcd4;color:#fff;}。支持的属性包括color、background-color、text-shadow和background（含渐变），但不支持边距、边框、字体大小等布局属性。
-
text-indent是HTML首行缩进的唯一标准解法，推荐使用text-indent:2em实现稳定2字符缩进；全角空格等替代方案不可靠，仅限无CSS场景临时使用。
-
HTML5无新浮动清除机制，clear:both失效主因是父容器未形成BFC致高度塌陷；推荐伪元素法.clearfix::after清除浮动，或直接用flex/grid替代float布局。
-
本文介绍如何通过监听鼠标点击事件获取坐标，将弹出框精准定位在图像映射（imagemap）热点区域的右下方，避免遮挡原图，提升交互体验。
-
JavaScript组件化核心是封装状态、隔离逻辑、声明式渲染、可组合更新四思路；可用Class封装生命周期，函数组件模拟Hooks，vnode+diff实现声明式更新，children和插槽支持组合嵌套。
-
relative定位不脱离文档流，始终保留原始占位，不影响兄弟元素布局和父容器高度计算；top/left等偏移仅改变视觉位置，z-index只影响层叠顺序。
-
HTML5极坐标图片变换是通过Canvas2D手动实现的坐标映射：将笛卡尔坐标(x,y)转为极坐标(r,θ)，再反向采样原图像素，需用getImageData/putImageData逐像素控制，非CSS或SVG内置功能。
-
利用flex-grow和媒体查询实现自适应导航栏：通过flex-grow让主菜单自动填充剩余空间，结合媒体查询在不同屏幕下切换布局，小屏隐藏菜单并显示汉堡按钮，中大型屏均分或居中导航项，实现响应式设计。
-
应使用requestAnimationFrame替代setTimeout/setInterval实现动画，因其对齐浏览器刷新帧、避免强制同步布局与掉帧；需批量读写DOM、优先用transform/opacity、善用CSS动画与will-change、节流事件并清理动画实例。
-
async/await是基于Promise的语法糖，使异步代码更直观；async函数自动返回Promise，await在async内暂停执行并等待Promise完成，支持错误捕获且不阻塞线程。
-
输入框获得焦点时边框不生效，主因是outline覆盖、选择器优先级不足或移动端viewport限制；应重置outline、提高specificity、用:focus-visible兼顾可访问性，并检查user-scalable设置。
-
内存泄漏常见于对象不再需要时仍被引用，导致内存无法释放，可通过理解生命周期、使用开发者工具和良好编码习惯来预防；具体措施包括及时解绑事件、清除定时器、避免全局变量滥用、限制缓存大小，并利用内存快照与性能监控定位问题，结合定期审查确保长期稳定。
-
JavaScript事件按捕获→目标→冒泡三阶段运行；stopPropagation()阻止冒泡，preventDefault()取消默认行为；passive和once选项可优化高频事件性能。
-
答案：WebSocket连接失败可能因服务器未启动、端口被占用、防火墙阻止、URL错误或协议不兼容。具体描述：服务器未启动或端口被占用会导致连接无法建立；防火墙或安全策略可能拦截请求；客户端WebSocketURL配置错误将导致连接失败；浏览器对非加密页面限制ws连接；服务器与客户端协议版本不匹配也会引发问题。
