使用jQuery 確定HTML 元素是否為空

在Web 開發領域，通常需要根據空或非來執行操作HTML 元素為空。為了使用 jQuery 實現這一點，讓我們探索一種萬無一失的方法。

為了驗證 HTML 元素是否沒有內容，jQuery 提供了 is(':empty') 選擇器。此選擇器檢查沒有任何子元素的元素，使其成為檢測空元素的可靠方法。

if ($('#element').is(':empty')) {
  // do something
}

此外，為了進行更精細的控制，您可以利用 $.trim(el.html()) 函數來忽略空格和換行符等不可見字元。這確保了解釋空元素構成的一致性：

function isEmpty(el) {
  return !$.trim(el.html());
}

if (isEmpty($('#element'))) {
  // do something
}

值得注意的是，「空」的定義在不同瀏覽器中可能略有不同。對於更標準化的方法，可以將此函數轉換為 jQuery 外掛。

透過利用 is(':empty') 選擇器或自訂 isEmpty 函數，您可以自信地確定 HTML 元素是否為空，並且採取適當的行動。