DOMドキュメント: DOM の「D」。Web ページが作成され、Web ブラウザーに読み込まれると、記述された Web ドキュメントがドキュメント オブジェクトに変換されます。 オブジェクト: DOM の「O」であるオブジェクトは、自己完結的なデータの集合です。特定のオブジェクトに関連付けられた変数はそのオブジェクトの属性と呼ばれ、特定のオブジェクトを通じてのみ呼び出すことができる関数はそのオブジェクトのメソッドと呼ばれます。 モデル: DOM の「M」は、何かの表現です。 DOM はドキュメントを家系図として表現します。 ノードノード: ドキュメントは、ドキュメント ツリー上の枝と葉であるノードで構成されます。 DOM には、要素ノード、テキストノード、属性ノードなど、さまざまな種類のノードが存在します。 要素ノード:タグの名前は要素の名前です。テキスト段落要素の名前は「p」、順序なしリスト要素の名前は「u1」、リスト項目要素の名前は「1i」です。 要素には他の要素を含めることができます。 「ショッピング リスト」ドキュメントでは、すべてのリスト アイテム要素が順序なしリスト要素内に含まれています。実際、別の要素内に含まれていない唯一の要素は、ノード ツリーのルート要素である 要素です。 テキストノード:要素ノードは単なるノードの一種です。ドキュメントが完全に空の要素で構成されている場合、構造は存在しますが、ドキュメント自体にはコンテンツが存在しません。コンテンツが王様であるインターネットでは、コンテンツの大部分はテキストで提供されます。たとえば、<p> 要素に含まれるテキストはテキスト ノードです。 プロパティ ノード:属性ノードは、要素のより具体的な説明を提供するために使用されます。たとえば、ほとんどすべての要素には title 属性があり、これを使用して要素に含まれる内容を正確に説明できます。属性ノードは常に要素ノードに含まれます。 要素を取得要素ノードを取得する DOM メソッドは 3 つあり、1 つは要素 ID、1 つはタグ名、もう 1 つはクラス名によるものです。 getElementById() DOM には getElementById というメソッドがあり、これは指定された id 属性値を持つ要素ノードに対応するオブジェクトを返します。これはドキュメント オブジェクトに固有の関数です。関数名の後には、関数パラメータを含む括弧のペアを続ける必要があります。 getElementById メソッドにはパラメータが 1 つだけあります。取得する要素の id 属性の値は、一重引用符または二重引用符で囲む必要があります document.getElementById("購入")` タグ名による要素の取得() getElementsByTagName メソッドは、指定されたタグを持つドキュメント内の各要素ごとに 1 つのオブジェクトの配列を返します。このメソッドにも、タグの名前であるパラメータが 1 つだけあります: タグ名によって要素を取得します("li"); クラス名による要素の取得()このメソッドは、Class 属性のクラス名で要素にアクセスできます。 getElementsByClassName はクラス名という 1 つのパラメータのみを受け入れます。 クラス名による要素の取得(クラス) このメソッドの戻り値は getElementsByTagName() に似ており、同じクラス名を持つ要素の配列になります。のように: document.getElementsByClassName("セール"); このメソッドは、文字列パラメータ内でクラス名をスペースで区切ることで、複数のクラス名を持つ要素を検索するためにも使用できます。 要約: 1. ドキュメントはノードです。 2. ノードは、要素ノード、属性ノード、テキストノードという異なるタイプに分けられます。 3. getElementById は、ドキュメント内の特定の要素に対応するオブジェクトを返します。 4. getElementsByTagName と getElementsByClassName は、ドキュメント内の特定の要素ノード セットに対応するオブジェクトの配列を返します。 5. 各ノードはオブジェクトです。 この記事はこれで終わりです。皆さんのお役に立てれば幸いです。また、123WORDPRESS.COM のその他のコンテンツにも注目していただければ幸いです。 以下もご興味があるかもしれません:
|
XHTML CSS ページ制作中に遭遇する問題の解決策は、解決策と呼ぶには少々大げさです。せいぜい、...
問題コードuseEffectによって発生したクロージャの問題コードを見てみましょう 定数 btn =...
目次定義2. 使用シナリオ3. 例を挙げる4. コーディング定義オブザーバー パターンは 1 対多の...
1. VMware Workstation 上の Linux: 1. ソースの更新(オプション) v...
ElasticSearch クラスターは、クラスターを構築するための動態請求的方式と靜態配置文件をサ...
序文プロジェクトのリリースでは、常に特定の状況に応じたパッケージ化が必要です。Angular CLI...
目次序文1. SCPの使用法2. sftpを使用する3. scp と sftp の違いは何ですか?ど...
1. はじめに(1)vw/vhの紹介使用する前に、vw と rem とは何か、その機能について簡単に...
目次概要ビルドプロセス関連APIリードライン基本的な使い方チョーククリア手順に関する追加情報完全なコ...
この記事では、MySQL データベースの一般的な操作テクニックをまとめます。ご参考までに、詳細は以下...
TS で時間を過ごした場所をいくつか記録します。 (まず、文句を言わせてください。stackover...
コードと同様に、テーブルや列にコメントを追加して、他のユーザーがその機能を理解できるようにすることが...
目次落とし穴充填方法何の穴ですか?要約する落とし穴最近、仕事で商品の割引価格を計算すると、いつも1セ...
XML/HTML コードコンテンツをクリップボードにコピー<ボタンスタイル= "カ...
目次1. 特徴2. 例3. オプション4. 基本的な文法5. ライフサイクル6. ルーティング管理 ...