-
本文介绍在Safari和MicrosoftEdge阅读模式下适配UI的可靠方法，重点推荐语义化HTML与ARIA角色的原生支持方案，并补充JavaScript检测与CSS回退策略，兼顾兼容性与未来稳定性。
-
JavaScript错误类型主要有SyntaxError、ReferenceError、TypeError、RangeError、URIError和EvalError（已废弃）；其中ReferenceError和TypeError最常见，SyntaxError无法用try...catch捕获。
-
IE9–IE11原生不识别HTML5语义标签，需用html5shiv通过document.createElement注册标签并配合CSS显式设display:block；IE8及以下会忽略标签仅保留文本；IE10+虽支持标签但Flex/Grid兼容性差，须加前缀或降级处理。
-
可通过内联style、内部CSS、CSS类名、根字体尺寸调整及行高字重组合五种方式调整HTML标题大小，分别适用于单个控制、统一设置、灵活复用、全局缩放和视觉增强场景。
-
CSS背景渐变不平滑的主因是色标设置不合理、角度单一及缺乏过渡层次；应合理分布色标、选用非整数斜向角度（如137deg）、引入HSL色彩或透明度优化，提升视觉平滑度。
-
transition适用于一次性交互状态变化，需明确起止样式；animation适合循环或复杂时序，支持关键帧与播放控制；二者可协同但同属性不叠加，性能上transition在transform/opacity更优。
-
监听inputfile的change事件获取FileList，用FormData构建数据体并用XMLHttpRequest上传，注意校验空文件、类型限制、进度监听及响应解析。
-
答案：Symbol.iterator是ES6提供的特殊符号，用于定义对象的迭代行为。当对象实现[Symbol.iterator]()方法并返回具有next()方法的迭代器时，即可被for...of、展开运算符等遍历。该方法返回形如{value,done}的对象，控制迭代过程。通过手动实现[Symbol.iterator]，可使自定义对象成为可迭代对象，如数字范围遍历示例所示，体现了JS统一的遍历机制和良好的控制流协作。
-
history.pushState()新增历史记录，适合导航跳转；replaceState()替换当前记录，适合修正URL而不留返回点；二者均需配合popstate监听及服务端配置防404。
-
通过函数封装和polyfill解决浏览器兼容性问题，确保新特性在旧环境中正常运行。首先检测原生支持，如不存在则提供替代实现，例如requestAnimationFrame的多版本兼容；对于缺失API，采用polyfill模拟行为，如Array.isArray的类型判断；优先使用标准库避免重复定义；结合构建工具按需引入core-js等方案；开发中应依据caniuse数据，通过typeof检测、轻量封装和跨浏览器测试保障稳定性。
-
数组扁平化是将多维数组转为一维的过程，常用方法包括：1.使用flat()方法（ES2019），支持指定层数或Infinity彻底展开；2.递归结合reduce实现，兼容性好且灵活；3.toString后split仅适用于纯数字数组；4.扁平化同时去重可结合flat(Infinity)与Set。日常推荐优先使用flat()。
-
CSS属性选择器[attr]可匹配任意含指定属性的元素，无论属性是否有值；如[title]选中所有带title属性的元素，注意大小写敏感性及与[attr="value"]的区别。
-
用position:fixed实现悬浮客服框需将元素直接挂载到body下，设right:20px、bottom:20px和z-index:9999，避免祖先元素设置transform/filter创建新包含块，并注意iOS地址栏变化及微信X5内核的z-index兼容性问题。
-
使用rem单位结合媒体查询可解决多设备字体不一致问题：rem相对于根元素字体大小，通过媒体查询动态调整html的font-size，使文字等比缩放；配合vw单位可实现更平滑的响应式效果，推荐设定清晰断点并统一项目字体单位，确保各屏幕下显示协调。
-
TailwindCSS通过预设类名快速设置间距和字体大小，提升开发效率。①使用mt-4、py-2等类控制外边距和内边距，基于4px增量确保视觉一致；②用text-lg、font-semibold等类设定字体大小与字重，支持响应式断点；③组合p-4、mb-2等类实现无需自定义CSS的高效布局，样式逻辑集中于HTML，便于维护与协作。
