javascriptとjqueryを使ってdomノードの存在を検出する方法例を詳しく解説

1. JavaScript はページ内に DOM ノードが存在するかどうかを判断します

JavaScript のネイティブ関数には、DOM ノードが存在するかどうかを判断するメソッドがありません。通常、オブジェクトを返す document.getElement.. メソッドを通じて DOM ノードを取得します。配列セットを渡すことができます。 object[0]、object[1] は、このコレクション内の各オブジェクトにアクセスするために使用されます。配列セットが返されるため、長さ属性があり、長さが 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

上記 2 つのメソッドは、実際にはオブジェクト コレクションの長さ属性に基づいてオブジェクトが存在するかどうかを判断します。

以上がjavascriptとjqueryを使ってdomノードの存在を検出する方法例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。