首頁 > web前端 > js教程 > 如何在不使用 getElementById 的情況下檢查可見 DOM 中是否存在元素

如何在不使用 getElementById 的情況下檢查可見 DOM 中是否存在元素

DDD
發布: 2024-10-21 22:18:31
原創
857 人瀏覽過

How to Check if an Element Exists in the Visible DOM Without Using getElementById

如何檢查可見DOM 中的元素是否存在

要在不使用getElementById 的情況下確定元素是否存在於可見DOM 中,請考慮以下內容替代方案:

檢查文件正文中的存在:

根據Csuwldcat 的建議,可以使用DOM 元素的contains() 方法來檢查元素是否是後代文檔正文的。此方法傳回布林值,指示該元素是否是可見 DOM 的一部分。

<code class="js">document.body.contains(elementReference);</code>
登入後複製

使用其他元素選擇方法:

其他元素選擇方法,例如querySelector()、querySelectorAll() 和getElementsByClassName() 等可用於根據特定條件尋找元素。如果產生的元素引用或 NodeList 的長度為 0,則該元素不存在。

例如,要檢查 id 為「find-me」的元素:

<code class="js">var elementExists = !!document.getElementById("find-me");</code>
登入後複製

注意:querySelector() 和 querySelectorAll() 分別傳回第一個符合元素或 NodeList。 getElementsByClassName() 傳回一個 NodeList。因此,需要檢查 NodeList 的長度屬性來確定元素是否存在。

檢查元素是否存在的自訂函數:

提供的isNull 函數可用於透過暫時分配一個隨機ID、搜尋具有該ID 的元素,然後刪除該隨機ID 來檢查元素是否存在。這種方法可以有效驗證 DOM 中是否存在該元素。

JavaScript 變數行為的相關資源:

  • [了解JavaScript 作用域與閉包](https: //developer.mozilla.org/en- US/docs/Glossary/Closure)
  • [JavaScript 變數:值與引用](https://www.w3schools.com/js/js_variables.asp)
  • [JavaScript 中按值傳遞與依引用傳遞](https://developer.mozilla.org/en-US/docs/Glossary/Pass_by_reference)

以上是如何在不使用 getElementById 的情況下檢查可見 DOM 中是否存在元素的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板