jQuery入門学習ノート(一)

6618 ワード

最も混同されやすいいくつかの概念
jQueryオブジェクトがDOMオブジェクトに等しくない
DOMはDocument Object Modelの略で、中国語はドキュメントオブジェクトモデルです.HTMLとXMLのアプリケーションインタフェースで、DOMはページ全体を階層ノードからなるファイルにマッピングします.【例1】
<!DOCTYPE html>
<html lang="en">
<head>
    <title>  DOM  </title>
</head>
<body>
<h1>             </h1>
<ul>
    <li>D    </li>
    <li>O    </li>
    <li>M    </li>
</ul>
</body>
</html>

このDOMの木の中で、
  • ラベルはすべて
    ラベルのサブノードは、DocumentオブジェクトのgetElementByTagName()メソッドでアクセスできます.上のノードと要素はすべてDOMオブジェクトのコンポーネントであり、getElementByTagName()はDOMモデルが提供する組み込みメソッドであり、これらはすべてDOMオブジェクトベースを構成しています.
    jQueryオブジェクトは、jQueryフレームワークを介してDOMオブジェクトをパッケージした後に生成される新しいオブジェクトであり、本質的にはDOMオブジェクトの集合を含むjsオブジェクトである.

  • jQueryフレームワークは、jQueryオブジェクトに対して独立して使用されるメソッドとプロパティを定義します.DOMオブジェクトメソッドを直接呼び出すことはできません.逆に、DOMオブジェクトもjQueryオブジェクトのメソッドまたはプロパティを直接呼び出すことはできません.$(“#wrap”).innerHTML=「埋め込みテキスト」;//jQueryオブジェクト呼び出しDOMプロパティ
    jQueryオブジェクトとDOMオブジェクトの変換
    両者は、動作するオブジェクトがDOM要素であるため、互いに変換することができるが、jQueryオブジェクトには複数のDOM要素が含まれており、DOMオブジェクト自体がDOM要素である.1.#####jQueryオブジェクトをDOMオブジェクトに変換*jQueryオブジェクトセットのDOM要素オブジェクトを配列の下付き文字で読み込む
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <title>  DOM  </title>
        <meta charset="utf-8"/>
    </head>
    <body>
    <h1>             </h1>
    <ul>
        <li>D    </li>
        <li>O    </li>
        <li>M    </li>
    </ul>
    </body>
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript"> $(function () { var $li=$("li"); var li = $li[0]; alert(li.innerHTML); }) </script>
    </html>
    *   jQuery    , get()  , get()         ,   jQuery       DOM    
    
        $(function () {
            var $li=$("li");
            var li = $li.get('0');
            alert(li.innerHTML);
        })
  • ######DOMオブジェクトをjQueryオブジェクトに変換してDOMオブジェクトに対して直接彼を$()関数に渡すと、jQueryオブジェクトは自動的にjQueryオブジェクトにパッケージされ、jQuery定義のメソッドを自由に呼び出すことができます.
  • <script type="text/javascript"> $(function () { var li = document.getElementsByTagName('li'); var $li=$(li[0]); alert($li.html()); }) </script>

    jQueryのreadyはJavascriptのloadに等しくない
    load時間は、Webページのすべてのコンテンツがロードされるまで実行されません.jQueryのreadyイベントは、DOM構造の描画が完了した後に実行されます.つまり、外部ファイルのロードよりも先に実行されます.