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

HTMLDOMfirstElementChildプロパティ

HTML DOMのfirstElementChildプロパティは、指定された要素の最初の子要素を返すために使用されます。子要素は要素ノードとしてのみ返されます。テキストノードとコメントノードを無視し、それらを考慮しません。これは読み取り専用のプロパティです。

構文

以下は、HTMLDOMfirstElementChildプロパティの構文です-

element.firstElementChild

例

firstElementChildプロパティの例を見てみましょう-

<!DOCTYPE html>
<html>
<head>
<script>
   function eleChild() {
      var ch = document.getElementById("DIV1").firstElementChild.innerHTML;
      document.getElementById("Sample").innerHTML = "The first element child node of the div is :"+ch;
   }
</script>
</body>
</html>
<h1>firstElementChild property</h1>
<div id="DIV1">
<p>This is a p element</p>
<span>This is a span element</span>
</div>
<button onclick="eleChild()">Get Child</button>
<p id="Sample"></p>
</body>
</html>

出力

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

HTMLDOMfirstElementChildプロパティ

「子を取得」メソッドをクリックすると-

HTMLDOMfirstElementChildプロパティ

上記の例では-

ユーザーがクリックするとeleChild（）メソッドを実行する「GetChild」ボタンを作成しました-

<button onclick="eleChild()">Get Child</button>

eleChild（）関数は、IDが「DIV1」のdivのfirstElementChildを取得し、そのinnerHTMLプロパティを変数chに割り当てます。 firstElementChildは空白を考慮しないため、

要素を返します。 innerHTMLプロパティを使用して、

要素内のテキストを取得し、IDが「Sample」-

の段落に表示します。 
function eleChild() {
   var ch = document.getElementById("DIV1").firstElementChild.innerHTML;
   document.getElementById("Sample").innerHTML = "The first element child node of the div is :"+ch;
}

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

    HTML DOMスタイルのpageBreakInsideプロパティは、HTMLドキュメントのHTML要素内の印刷または印刷プレビューのページ分割動作を返し、変更します。 構文 以下は構文です- 1. pageBreakInsideを返す object.pageBreakInside 2.pageBreakInsideの変更 object.pageBreakInside = “value” ここで、値は-になります。 値 説明 初期 このプロパティ値をデフォルト値に設定します。 継承 このプロパティ値は親要素から継承されます。 自動 必要に応じて、H

  2. HTMLDOMスタイルの表示プロパティ

    HTML DOMスタイルの表示プロパティは、要素の表示タイプを設定または返すために使用されます。要素は主にブロックまたはインラインです。 display：noneを使用して要素を非表示にすることもできます。 以下は、-の構文です。 表示プロパティの設定- object.style.display = value 上記のプロパティ値は次のように説明されます- 値 説明 インライン 要素をインライン要素として表示する場合、つまり、widthプロパティとheightプロパティは効果がありません。 ブロック ブロック要素は新しい行に表示され、幅全体を取ります。