jQueryシリーズ(三)--DOM

4094 ワード

要素と属性の作成
JavaScript:
  • 作成要素:document.createElement()
  • プロパティの設定:setAttribute()
  • 追加テキスト:innerHTML()
  • 文書:append()
  • jQuery:
  • 要素ノードの作成:$( 'html ' )
  • テキストノードの作成:$( '
    text node
    ' )
  • 属性ノードの作成:$( '
    text node
    ' )
  • jQuery DOM API
    DOM node挿入
  • 内部挿入
  • .append(content)=>一致する要素ごとにコンテンツを追加します.前は挿入するオブジェクトであり、後はオブジェクト内に挿入する要素の内容
  • である.
  • .appendTo(obj)=>すべての一致要素を別の指定された要素セットに追加します.前は挿入する要素の内容であり、後は挿入されるオブジェクト
  • である.
  • 外部挿入
  • .after(content)=>一致する要素のセット内の各要素の後に、その兄弟ノード
  • としてパラメータによって指定された内容を挿入する.
  • before(content)=>一致する要素の前にコンテンツ
  • を挿入する.
  • 内部挿入
  • .prepend()=>一致する各要素の内部の前置コンテンツ
  • .
  • .prependTo()=>一致するすべての要素を別の指定された要素セットの
  • に前置する.

    説明:.peopend()メソッドは、指定された要素をマッチング要素の最初のサブ要素として挿入します..append()法は最も最後のパラメータである.
  • 外部挿入:contentは前、()内は要素
  • .insertAfter()=>一致する各要素
  • をターゲット要素の後ろに挿入する.
  • .insertBefore()=>一致する各要素
  • をターゲット要素の前に挿入する.

    DOM node削除
  • .empty()=>指定した要素のすべてのサブノード
  • を除去する.
  • .remove()=>自身を除去するとともに、バインドされたイベントおよびその要素に関連するjQueryデータを含む要素内部のすべてを除去する注意:.remove()は、除去される一致する要素の集合をフィルタリングするためのセレクタ式を伝達することができ、ノード
  • を選択的に削除することができる.
  • .detach()=>データを保持する削除操作.現在のページから要素を削除するウェブ要素を管理するが、この要素を保持するメモリモデルオブジェクト注意:.detach()メソッドはjQuery固有であるため、jQueryメソッドでバインドされたイベントまたはデータしか処理できず、.append()で削除された要素をドキュメントストリームに戻すことができる
  • .
    DOM nodeレプリケーションと置き換え
  • .clone()=>すべての一致する要素のセットをコピーし、すべての一致する要素、一致する要素の下位要素、およびテキストノードを含む注意:ノードにイベントやデータなどの他の処理がある場合は、.clone(true)を介してブール値trueを指定する必要があります.これは、単純なクローンノード構造だけでなく、付属のイベントとデータのコピーも行います.
  • .replaceWith(newContent)=>セット内の一致するすべての要素を提供されたコンテンツで置き換え、削除された要素のセット
  • を返す.
  • .replaceAll(target)=>各ターゲット要素の注意をセットの一致要素で置き換えます.
  • .replaceWith()および.replaceAll()は、ノードに関連付けられたすべてのデータおよびevent handler
  • を削除する.
  • .replaceWith()はjQueryオブジェクトを返し、チェーン式で使用することができるが、返されるjQueryオブジェクトは、.replaceWith() / .replaceAll()の方法で置き換えるノード
  • ではなく、置き換える前のノードを参照する.
  • .wrap()=>要素を他の要素で包む、すなわち要素に親要素を追加し、元の要素セットを返してチェーンメソッド
  • を後で使用する.
  • .unwrap()=>一致する要素の親要素を削除し、自身を元の位置
  • に保持します.
  • .wrapAll()=>集合内の要素を別の要素で囲み、親要素(各要素がそれぞれ囲み)
  • を追加します.
  • .wrapInner()=>集合内の要素の内部のすべてのサブ要素を他の要素で包む、指定された要素のサブ要素
  • とする.
    jQuery遍歴
  • .children()=>一致する要素のセット内の各要素のすべてのサブ要素を返し、セレクタ
  • を受け入れることができる.
  • .find()=>DOMツリー内の要素の子孫要素(自分を含まない子孫のみを巡回)
  • を検索します.
  • .parent()=>コレクション内の各要素の親要素を検索
  • .parents()=>コレクション内の各要素の祖先要素
  • を検索
  • .closest()=>要素自体から始め、DOMツリー上で段階的に上へ要素が一致し、最初に一致した祖先要素に戻る注意:.parents().closest()の違い
  • の開始位置が異なります..parents()は親要素で開始します..closest()は、現在の要素
  • から開始する.
  • が遍歴するターゲットは異なります..parents()はルート要素を検索し、一致する要素をセットに追加します..closest()は、一致するものが見つかるまで検索を停止する
  • .
  • の結果は異なります..parents()は、0または1以上の要素を含むjQueryオブジェクトを返します..closest()は、0個または1個の要素を含むjQueryオブジェクト
  • を返す.
  • .next()=>指定された要素のセット内の各要素が隣接する後の世代の要素のセット
  • を検索します.
  • .prev()=>指定された要素のセット内の各要素が隣接する前の世代の要素のセット
  • を検索します.
  • .siblings()=>指定された要素のセット内の各要素の同世代要素
  • を検索します.
  • .add()=>一致する要素セットに要素を追加する新しいjQueryオブジェクトを作成します.
  • .each()=>forループの反復器で、jQueryオブジェクトのDOM要素を反復し、コールバック関数が実行されるたびに、パラメータ(0から).each()として現在のループ回数が渡され、コールバックによって処理され、2つの固定された実パラメータ=>インデックス(index)と要素(element).each( (index,element) => {} )
  • があります.