DOM 操作与事件交互
HTML、CSS 与 JavaScript 基础#Python全栈#第七阶段#HTML、CSS 与 JavaScript 基础#DOM 操作与事件交互约 728 字 · 2 分钟阅读
追问显示点击任意追问卡片可收起 / 展开
DOM 是什么，与 HTML 源文件有什么关系？
追问 JavaScript 修改页面后，为什么开发者工具中的元素树可能与“查看源代码”不同？
如何查找单个 DOM 元素和一组 DOM 元素？
追问
querySelector 未匹配时返回什么？querySelectorAll 的结果是否会自动反映后来添加的节点？如何创建、插入、更新和删除一个列表项？
追问 怎样用稳定的数据 ID 对应节点，避免把显示顺序误当成业务标识？
HTML 属性与 DOM 对象属性是否总是同步对应？
追问 用户修改输入框后，
value 与 getAttribute('value') 可能有什么区别？复选框当前状态应如何读取？怎样通过 classList 控制元素状态？
追问 与直接覆盖
className 或大量设置内联样式相比，怎样避免删除已有样式或散落状态逻辑？事件捕获、目标阶段与冒泡分别是什么？
追问
event.target 与 event.currentTarget 有什么区别？点击按钮中的图标时它们会指向哪里？事件委托怎样帮助处理动态列表？
追问 如何通过
closest 找到对应按钮并确认它属于当前容器？哪些事件不能直接照搬冒泡方案？preventDefault 与 stopPropagation 有什么区别？
追问 拦截表单提交与阻止父容器点击逻辑分别需要什么？为什么两者不能互相替代？
展示用户输入时，textContent 与 innerHTML 应如何选择？
追问 为什么把不可信内容直接拼成 HTML 可能改变页面结构或引入脚本风险？确需富文本时应增加什么处理？
脚本执行时找不到页面元素，应该怎样排查加载时机？
追问 普通脚本、
defer、async 与模块脚本在执行顺序和 DOM 解析配合上有什么区别？核对资料： WHATWG DOM 标准。