JS/jQueryを使用してDOMノードが存在するかどうかを確認する簡単な方法-PHP开发-php.cn

JS/jQueryを使用してDOMノードが存在するかどうかを確認する簡単な方法

高洛峰

リリース： 2016-12-05 14:26:28

オリジナル

1442 人が閲覧しました

JS はページ内に DOM ノードが存在するかどうかをネイティブに判断します

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

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

ログイン後にコピー

使用法:

ページに次のノードがあると仮定します。

ノードがページ上にあるかどうかを判断します:

<div>这里是DIV节点</div>
<div>这里是DIV节点</div>
<span>这里是span节点</span>

ログイン後にコピー

注: document.getElementById() メソッドを使用してオブジェクトを取得する場合、exist() メソッドは使用できません。 ID に基づいてノードオブジェクトを取得する処理は取得できません。ノードの場合は空のオブジェクトが返され、プロトタイプのexist()関数が統合されないため、エラーが報告されます。したがって、ID に基づいてオブジェクトを取得する場合は、if(obj) を使用して、ページ内に DOM ノードが存在するかどうかを判断できます。これ

プロトタイプの追加:

var is_exist = document.getElementsByTagName(&#39;div&#39;).exist();
alert(is_exist); // true
  
var is_exist = document.getElementsByTagName(&#39;span&#39;).exist();
alert(is_exist); // true
  
var is_exist = document.getElementsByTagName(&#39;p&#39;).exist();
alert(is_exist); // false

ログイン後にコピー

使用方法:

ページに以下の DOM ノードがある場合

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

ログイン後にコピー

判断:

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

ログイン後にコピー

上記の 2 つの方法は、実際にオブジェクトは、オブジェクトコレクションの長さ属性に基づいて存在します。