直接用document.getElementById或querySelector返回值是否为null即可判断元素是否存在，最轻量可靠；ID区分大小写，动态插入需确保DOM已更新，querySelector支持任意CSS选择器但不匹配伪类，Shadow DOM中需通过shadowRoot查找。
直接用 document.getElementById 或 document.querySelector 返回值是否为 null 就能判断——这是最轻量、最可靠的方式，不需要 jQuery，也不依赖框架。
用 document.getElementById 判断 ID 元素是否存在
这是最常用也最稳妥的场景。ID 在规范中应唯一，且浏览器原生支持快、无兼容问题。
-
document.getElementById("myId")找到就返回元素对象，没找到返回null；直接用if (el)即可判断 - 别写
if (document.getElementById("myId") !== undefined)——null和undefined在这里等价，但语义不清，还多打字 - 注意大小写：ID 是区分大小写的，
myid和MyId不是同一个 - 如果元素是动态插入（比如 Ajax 加载后），必须确保执行判断时 DOM 已更新；否则会误判为不存在
用 document.querySelector 判断任意选择器元素是否存在
适用于 class、data 属性、复合条件等更灵活的场景，但要注意返回值类型和边界情况。
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
-
document.querySelector(".btn-primary[data-status='active"])找不到时返回null，不是空数组或 false - 别用
document.querySelectorAll(selector).length > 0——多一次遍历，性能差，且没必要 - 伪类如
:hover、:focus无法被querySelector匹配，它只查静态结构，不反映实时状态 - 遇到 Shadow DOM 内部元素，得先拿到 shadowRoot：
host.shadowRoot.querySelector(".inner")
jQuery 里为什么不能直接 if ($("#xxx")？
因为 jQuery 选择器永远返回一个 jQuery 对象（哪怕空），其布尔值恒为 true，所以这种写法完全失效。
立即学习“前端免费学习笔记（深入）”；
- 正确写法只有两种：
if ($("#xxx").length > 0)或if ($("#xxx")[0]) -
.length更直观；[0]是取原生 DOM 节点，非空即存在，但容易和数组误用混淆 - 即使元素不存在，
$("#xxx").text("hi")也不会报错——jQuery 内部已做过空处理，所以很多情况下根本不用判断 - 如果你项目里已引入 jQuery，又坚持用它查存在性，优先用
.length；但纯 JS 方案更轻、更快、无依赖
真正容易被忽略的不是语法，而是上下文：元素可能还没渲染、被 v-if 或 *ngIf 移除、在 iframe 里、或藏在 Shadow DOM 深处——这时候光看 HTML 源码或用 Ctrl+F 搜不到，得切到 Elements 面板手动展开、等 JS 执行完再查。
