如何分別使用javascript和jquery來偵測dom節點存在的方法實例詳解

1. JavaScript判斷DOM節點是否存在頁面中

JavaScript原生函數沒有提供判斷DOM節點是否存在方法，我們通常取得DOM節點幾乎都是document.getElement..方法，會傳回一個object數組合集，我們可以透過object[0]，object[1]這樣來存取這個合集的每一個物件。既然傳回的是數組合集，那麼就有length屬性，而length大於等於1即表示DOM節點存在頁面中

# #

Object.prototype.exist = function(){ 
 if(typeof this !='undefined' && this.length>=1){
  return true;
 }
 
 return false;
};

使用：

假設頁面有如下節點

#

<p>这里是p节点</p>
<p>这里是p节点</p>
<span>这里是span节点</span>

判斷節點是否在頁面：

var is_exist = document.getElementsByTagName('p').exist();
alert(is_exist); // true
 
var is_exist = document.getElementsByTagName('span').exist();
alert(is_exist); // true
 
var is_exist = document.getElementsByTagName('p').exist();
alert(is_exist); // false

注意：

如果使用是使用document.getElementById()方法取得物件的就不能使用exist()方法，因為根據ID取節點物件的方法在取不到節點的情況下會回傳一個空對象，不會整合原型exist()函數，所以會報錯！所以如果是根據ID取物件的可以直接if(obj)這樣既可判斷DOM節點是否存在頁面中

#2. jQuery判斷DOM節點是否存在頁面中

新增原型：

######

(function($) {
 $.fn.exist = function(){ 
  if($(this).length>=1){
   return true;
  }
  return false;
 };
})(jQuery);

###使用方法：###假如頁面有如下DOM節點############

这里是id=a节点
<p>这里是p节点</p>
<p>这里是p节点</p>
<span>这里是span节点</span>

###判斷：##### #######

alert($('#aaa').exist()); // false
alert($('#a').exist()); // true
alert($('p').exist()); // true
alert($('p').exist()); // false

###以上兩種方法其實都是根據物件集合的length屬性來判斷物件是否存在。 ###

以上是如何分別使用javascript和jquery來偵測dom節點存在的方法實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！