iT邦幫忙

8

用jQuery測試某個DOM元素是否存在

有時候我們需要知道頁面中一個dom元素是不是存在,再去做進一步的動作,那麼如何用jQuery測試這個DOM是否存在呢?
假設頁面上有個元素<div id="widget"></div>是用JavaScript寫入的,他可能根據某些情境才會出現,所以我們存取這個dom之前,要先測試一下。

如果我們用下面方式來測試,

$("#widget") ? true : false;

結果永遠會是true,不管頁面中有沒有這個元素,jQuery都會回傳一個陣列,差別只在有這個元素的話,陣列中會有值,沒這個元素的話,就是空陣列。

既然知道jQuery這個行為,我們就可針對它來處理。寫法如下:

($("#widget").size() > 0) ? true : false;

這樣抓得到的時候就會傳回true,抓不到就傳回false.

上面的寫法是方便說明才寫成這樣,就實務上,把

$("#widget").size() > 0

放進判斷式裡,就會測試對錯了,例如:

if($("#widget").size() > 0) {
  //存在#widget這個dom做下面的事
  ......
} else {
  //不存在#widget這個dom做下面的事
  ......
}

當然常用的話,也可以包成一個jQuery的plugin來用。


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
robinnpca
iT邦新手 5 級 ‧ 2019-01-25 10:53:13

$(this).parents(".target").eq(1).size() >0 這類的paraents請問要怎麼做呢?
得到的是Uncaught TypeError: $(...).parents(...).eq(...).size is not a function

我要留言

立即登入留言