HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTML DOM contains()メソッド


HTML DOM contains()メソッドは、ノードが指定されたノードの子孫であるかどうかを検出するために使用されます。子孫は、ノードの直接の子、孫、さらには曽孫になることができます。ノードが実際に指定されたノードの子孫であることを示すブール値trueを返し、指定されたノードの子孫でない場合はfalseを返します。

構文

以下は、HTML DOM contains()メソッドの構文です-

 node.contains(givenNode)

ここで、givenNodeは、givenNodeがノードに含まれているかどうかを指定する必須のパラメーター値です。

HTML DOM contains()メソッドの例を見てみましょう-

 <!DOCTYPE html>      

私はアメリカ合衆国

下のボタンをクリックして、attr要素がdiv要素の子孫であるかどうかを確認します

CONTAINS

出力

これにより、次の出力が生成されます-

HTML DOM contains()メソッド

DESCENDANTボタンをクリックすると-

HTML DOM contains()メソッド

上記の例では-

要素を持ち、

要素の中に要素があるID「DIV1」の

要素を作成しました。 「DIV1」に境界線が適用され、その幅はcssスタイルを使用して指定されています-

#DIV1 {border:2px solid blue; width:160px;} 

私はアメリカ合衆国

<に住んでいます/ pre>

次に、ユーザーがクリックしたときにdivDesc()メソッドを実行するボタンCONTAINSを作成しました-

  

divDesc()メソッドは、ドキュメントオブジェクトのgetElementById()メソッドを使用して要素を取得し、それをattr変数に割り当てます。次に、

要素のcontainsメソッドを使用し、要素をパラメーターとして渡します。

要素には要素が含まれているため、つまり要素は
要素の子孫であるため、trueを返します。条件文を使用して、IDが「Sample」の段落のinnerHTMLプロパティを使用して適切なテキストを表示します-

 function divDesc(){var attr =document.getElementById( "At"); var div =document.getElementById( "DIV1")。contains(attr); if(div ==true)document.getElementById( "Sample")。innerHTML="スパン要素はdiv要素の子孫です。" else document.getElementById( "Sample")。innerHTML="スパン要素はdiv要素の子孫ではありません。"}

  1. HTMLDOMスタイルのflexGrowプロパティ

    HTML DOMスタイルのflexGrowプロパティは、要素がフレックス要素内でそのサイズに対応する比率を設定するために使用されます。単位のない数値を受け入れます。 以下は、-の構文です。 flexGrowプロパティの設定- object.style.flexGrow = "number|initial|inherit" ここで、numberは要素が他の要素に比例して大きくなる量を指定し、そのデフォルト値は0です。initialはプロパティ値をデフォルト値に設定し、inheritはそれを親プロパティ値に設定します。 flexGrowプロパティの例を見てみましょう-

  2. HTMLDOMオブジェクトオブジェクト

    HTMLのHTMLDOMオブジェクトオブジェクトは、 を表します 要素。 要素の作成 var objectElement = document.createElement(“OBJECT”) ここでは、「 objectElement 」は次のプロパティを持つことができます- プロパティ 説明 データ objectelementによって使用されているリソースのURLを設定/返します フォーム オブジェクト要素の囲み形式への参照を返します 高さ オブジェクト要素の高さを設定/返します 名前 オブジェクト要素の