-
JavaScript操作DOM的核心是通过内置API查找、读取和修改元素的内容、属性或样式；常用方法包括getElementById()和querySelector()查找元素，textContent与innerHTML修改内容，style与classList控制样式，createElement/append/remove动态操作节点，并需确保在DOM加载完成后执行。
-
:read-only仅匹配具有readonly属性的可编辑表单元素；它不响应contenteditable或disabled，且在ShadowDOM中需显式穿透。
-
事件委托能减少监听器数量是因为DOM事件会向上冒泡，只需在共同父容器监听一次，再通过event.target判断目标元素；适用于动态增删子节点场景，但需选择最近稳定父级而非document，且仅冒泡事件（如click、input）支持，focus/blur等需用focusin/focusout替代。
-
最常被忽略的错位原因是父容器overflow:hidden裁剪视频，以及autoplay静音策略导致尺寸计算延迟；需检查祖先元素overflow、用loadedmetadata事件获取宽高比，并优先用aspect-ratio或padding-bottom控制宽高比。
-
Modal全屏遮罩未覆盖整个视口，主因是position:fixed失效于新层叠上下文（如transform/overflow:hidden父容器）；应设fixed+100vw/100vh，并检查祖先属性。
-
本文详解Angular中因异步订阅导致data为undefined的根本原因，并提供两种可靠解决方案：在subscribe内部调用后续逻辑，或改用Promise+async/await实现同步化控制流。
-
iPadSafari因音频节能策略会主动中断HTML5音频：页面失焦、后台、无交互30秒或低电量模式下自动静音/暂停，且无法JS恢复；必须用用户手势触发play()，推荐m4a格式并添加PWA配置以提升锁屏续播成功率。
-
JavaScript是让静态网页变动态的关键行为层语言，负责响应操作、修改DOM、发起请求等；需确保脚本在元素后加载或监听DOMContentLoaded，用addEventListener绑定事件，优先用textContent修改内容，fetch需手动检查response.ok并处理异常。
-
本文介绍在JavaScript中如何将多个独立的正则替换逻辑（如清除URL、匹配特定模式单词、过滤特殊字符）安全、高效地合并为单次replace()调用，避免多次遍历字符串，提升性能与可维护性。
-
HTML5通过CSSscroll-behavior属性和JavaScriptscrollTo()等方法原生支持平滑滚动：全局设置html{scroll-behavior:smooth}启用锚点跳转平滑效果；JS调用scrollTo、scrollIntoView、scrollBy时传入behavior:'smooth'实现脚本控制；需检测兼容性并降级处理；可动态启用或禁用以适配不同交互场景。
-
使用Flexbox的align-items结合margin/padding控制，通过flex容器统一垂直对齐，配合媒体查询调整布局方向与间距，实现响应式表单提示对齐。
-
border-radius仅视觉裁剪背景，不改变盒模型尺寸：width/height、padding-box/border-box均不变，子元素仍按矩形布局；背景色/图/阴影被裁剪，但盒子本身仍是方形。
-
必须为video元素添加crossOrigin="anonymous"属性并正确设置canvas宽高，否则toDataURL()会因跨域污染或尺寸错误而失败。
-
伪元素opacity动画无法触发渐变重绘，因background-image不支持插值；可行方案为background-position位移、@keyframes帧动画或@property自定义属性插值。
-
HTML5标准框架需用语义化标签构建：先声明<!DOCTYPEhtml>和<htmllang="zh-CN">，再嵌套<head>（含viewport、charset、title）与<body>；body内按序使用<header><nav><main><aside><footer>，main中用<section><article><figure>
