jqueryのコア機能は何ですか

青灯夜游
青灯夜游オリジナル
2021-11-15 16:24:122770ブラウズ

jquery のコア関数: 1. jQuery()、主に HTML DOM 要素を取得し、それらを jQuery オブジェクトにカプセル化するために使用されます; 2. "jQuery.noConflict()"、変数 "$" を転送するために使用されます。 jQueryコントロール。

jqueryのコア機能は何ですか

このチュートリアルの動作環境: Windows7 システム、jquery1.10.2 バージョン、Dell G3 コンピューター。

jQuery コア関数

関数 説明
jQuery() 要素のコレクションと一致させるために使用される CSS セレクターを含む文字列を受け入れます。
jQuery.noConflict() この関数を実行して、変数 $ の制御を、それを実装する最初のライブラリに移します。

関数の説明

jQuery():

jQuery() 関数は、jQuery ライブラリのコア関数であり、jQuery ライブラリに含まれるすべての関数です。 jQueryはこの機能をベースにしています。この関数は主に、HTML DOM 要素を取得して jQuery オブジェクトにカプセル化するために使用されます。これにより、jQuery オブジェクトによって提供される他のプロパティやメソッドを使用して DOM 要素を操作できるようになります。

jQuery() 関数は非常に強力で、さまざまなタイプのパラメータを jQuery オブジェクトにインテリジェントにカプセル化できます。

構文

  • jQuery(selector, [ context ])
    セレクター文字列 selector に対応する HTML DOM 要素を jQuery オブジェクトにカプセル化します。オプションのパラメーター context は、DOM 要素の検索範囲を指定するために使用されます。
  • jQuery( [ obj ])
    指定されたオブジェクト obj を jQuery オブジェクトにカプセル化します。このオブジェクトは、DOM 要素 (Element)、DOM 要素の配列、jQuery オブジェクト (クローン)、またはその他のオブジェクトにすることができます。このパラメータを省略して、空の jQuery オブジェクトを返すこともできます。

jQuery 1.4 パラメータ obj を省略する新しい使用法を追加しました。パラメータを渡さないと、空の jQuery オブジェクトが返されます。

  • jQuery(html, [ ownerDocument ])
    HTML タグ文字列 html に基づいて一時的な DOM 要素を動的に作成し、それを jQuery オブジェクトとしてカプセル化します。オプションのパラメータ ownerDocument は、一時 DOM 要素が作成されるドキュメントを指定するために使用されます (フレーム ページなど、複数のドキュメントがある場合)。

jQuery 1.0 では、この使用法が追加されました。

  • jQuery(html,properties)
    HTML タグ文字列 html と、その追加のプロパティ、イベント、メソッドを含むプロパティ オブジェクトに動的に基づいて一時的な DOM 要素を作成し、それを jQuery オブジェクトとしてカプセル化します。

jQuery 1.4 では、この使用法が追加されました。

  • jQuery( callback )
    現在のドキュメントがロードされた後、指定された関数コールバックを実行します。この使用法は、ready() 関数の次の使用法の省略形です: jQuery(document).ready(callback)。

jQuery 1.0 では、この使用法が追加されました。

#パラメータ

属性説明##selectorString typecontextオプション/オブジェクト タイプobjオプション/オブジェクト タイプhtmlオブジェクト タイプownerDocumentドキュメント タイプpropertiesオブジェクト タイプcallback関数タイプ

戻り値

jQuery() 関数の戻り値は jQuery 型であり、jQuery オブジェクトを返します。

例と説明:

  • ##jQuery(selector, [ context])コード例:
  • // 选择当前文档中所有的p标签DOM元素
    $("p");
    
    // 选择id属性为username的DOM元素
    $("#username");
    
    // 选择所有包含test样式的DOM元素,(例如:class="test")
    $(".test");
    
    // 选择所有p标签中带test样式的DOM元素
    $("p .test");
    #jQuery( [ obj ]
  • サンプル コード:
    var dom = document.getElementById("username");
    // 将DOM元素封装为jQuery对象
    $(dom);
    
    var doms = document.getElementsByName("book_id");
    // 将DOM元素数组封装为jQuery对象
    $(doms);
    
    // 将body元素封装为jQuery对象
    $(document.body);
    jQuery( html, [ ownerDocument ])
  • サンプル コード:
    // 创建一个空的span标签的临时DOM元素,并将其封装为jQuery对象
    // 以下三种方式的效果一致
    $(&#39;<span/>&#39;);
    $(&#39;<span></span>&#39;);
    $(&#39;<span>&#39;); // 但不推荐使用这种方式
    
    // 创建一个p标签,内部包含带有test样式的span标签
    $(&#39;<p><span class="test"></span></p>&#39;);
    
    // 创建一个表格
    var html = &#39;<table>&#39;;
    html += &#39;<tr>&#39;;
    html += &#39;<td>单元格1</td>&#39;;
    html += &#39;<td>单元格2</td>&#39;;
    html += &#39;</tr>&#39;;
    html += &#39;<tr>&#39;;
    html += &#39;<td>单元格3</td>&#39;;
    html += &#39;<td>单元格1</td>&#39;;
    html += &#39;</tr>&#39;;
    html += &#39;</table>&#39;;
    $(html);
    jQuery(html, プロパティ)
  • サンプル コード:
    // 创建一个临时的链接jQuery对象
    var tempLink = $(&#39;<a/>&#39;, {
        id: &#39;goback&#39;,
        title: &#39;CodePlayer&#39;,
        html: &#39;CodePlayer&#39;, // 表示链接的锚文本,也就是innerHTML的值
        href: &#39;http://www.365mini.com/&#39;,
        click: function(){
            // 统计点击次数       
        }
    });
    // 追加到body标签内容的末尾
    tempLink.appendTo("body");
    
    
    $(&#39;<input/>&#39;, {
        type: &#39;checkbox&#39;,
        val: &#39;def&#39;, // 表示表单元素的value属性值或textarea的输入内容
        click: function(){
            alert("点击了复选框");
        }
    }).appendTo("body");
#jQuery( callback )
    サンプル コード:
  • $(function(){
        // 本文档页面载入完成后自动执行
        alert("文档加载完毕!");
    });
    
    // 这相当于ready()函数如下用法的简写
    
    $(document).ready(function(){
        // 本文档页面载入完成后自动执行
        alert("文档加载完毕!");
    });
    jQuery.noConflict()
noConflict() メソッドは、変数 $ の jQuery 制御を譲渡します。

このメソッドは、$ 変数の jQuery 制御を解放します。

このメソッドは、jQuery 変数の新しいカスタム名を指定するためにも使用できます。

ヒント: このメソッドは、他の JavaScript ライブラリが関数に $ を使用する場合に役立ちます。

構文:

jQuery.noConflict(removeAll)


removeAll ブール値。jQuery 変数の完全な復元を許可するかどうかを示します。
  • 関連ビデオチュートリアルの推奨事項:
  • jQuery チュートリアル
(ビデオ)

対応する DOM 要素を検索するために使用される、指定されたセレクター文字列。
セレクター文字列の検索範囲を指定します。これには、DOM 要素、DOM 要素配列、ドキュメント、 jQueryオブジェクト。このパラメータを省略した場合、デフォルトで現在のドキュメントが使用されます。
指定されたオブジェクトは、jQuery オブジェクトをカプセル化するために使用されます。 DOM 要素、DOM 要素配列、ドキュメント、jQuery オブジェクトなどを指定できます。
指定された HTML タグ文字列 (例: "a6f776b766579c28d02706af09482172"、"974caddea13691ad156e2cd3a72fd18e", "d0659237eeb5c5f8cf72d25d81da40c994b3e26ee717c64999d7867364b1b4a3" (タグは、HTML 構文に準拠している限り、タグ内にネストすることもできます)。
DOM 要素が一時的に作成されるドキュメントを指定します。デフォルトは現在のドキュメントです。
指定されたオブジェクトは、DOM 要素のプロパティ、イベント、メソッドを指定するために使用されます。例: {name:”username”, “click”:function(){}}
指定された関数、 DOM ドキュメントがロードされた直後に実行されるために使用されます。

以上がjqueryのコア機能は何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。