未闭合的标签会导致浏览器自动补全，使dom结构与源码不一致，js操作依赖真实dom而非源码，因此document.queryselector('p').children可能返回空nodelist。
为什么 <p></p> 不闭合会导致 JS 找不到元素
浏览器会自动补全未闭合的 <p></p>，但 DOM 结构已不是你写的那样。比如写成 <p>第一段</p>
<p>第二段</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill5493" title="html-to-pptx"><img
src="https://img.php.cn/upload/skill/000/000/081/179051045119472.jpg" alt="html-to-pptx" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill5493" title="html-to-pptx" class="overflowclass">html-to-pptx</a>
<p class="overflowclass">将多页 HTML 演示文稿转换为美化的 PPTX 文件，便于分享和分发。</p>
</div>
<a rel="nofollow" href="/xiazai/skill5493" title="html-to-pptx" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div>，浏览器实际解析为 <p>第一段</p>
<p>第二段</p> —— 表面看着对，可一旦用 document.querySelector('p').children 就返回空 NodeList。
- JS 操作依赖真实 DOM 树，不是你写的源码顺序
<div>、<code><p></p>、<li>等块级双标签必须显式闭合，不能靠浏览器“猜”- 检查方式：打开开发者工具 → Elements 面板，看折叠结构是否符合预期
- 功能性图片（如按钮图标）：填动作，例如
<img src="delete.svg" alt="删除此项"> - 纯装饰图（无信息价值）：用空字符串
alt=""，不是删掉属性，也不是写alt="decorative" - 带链接的图：若链接文字已说明用途（如“点击查看年报 PDF”），图的
alt可为空；否则需补充关键信息，如alt="2025 年度财务摘要图表" -
<form></form>必须有action（目标地址）和method（GET或POST）；method默认是GET，但含敏感内容或大文本时得显式写method="POST" - 每个控件（
<input>、<select></select>、<textarea></textarea>）必须有name属性；id和class不参与提交 - 提交按钮要用
<button type="submit"></button>或<input type="submit">；<button></button>默认是type="button"，点它不会触发表单提交 - 最简单解法：把
<script></script>移到前，确保 DOM 已就绪 - 若必须放
，加defer属性：<script defer src="main.js"></script>，它会等 HTML 解析完成再执行 -
async不适合依赖 DOM 的脚本，它下载完立刻执行，时机不可控
<img> 的 alt 属性到底怎么填才合法
alt 不是可选项，W3C 要求所有 <img> 必须有该属性，否则 HTML 验证失败，无障碍检测直接报错。
<form></form> 提交不了数据？先查这三处硬性配置
表单能渲染、能点击，不等于后端能收到字段。漏掉任意一项，整个字段就“消失”在请求体里。
<script></script> 放 <div id="app">
<p>脚本在 <code> 中执行时，DOM 还没加载完，document.getElementById('app') 返回 null 是必然结果。
真正卡住新手的，往往不是记不住标签名，而是这些“写了但不起作用”的隐性规则 —— 它们不报错，却让 JS 获取不到节点、表单传不出数据、屏幕阅读器跳过关键信息。多看一眼 Elements 面板里的真实 DOM，比背十遍语法手册更管用。
