jQuery $.extend() の使用法の概要-jsチュートリアル-php.cn

この記事では、主に jQuery $.extend() の使用法を紹介します。必要な方は参考にしてください。

jQuery には、プラグインを開発するための 2 つのメソッドが用意されています。
jQuery.extend(object);
jQuery.extend(object); jQuery クラス自体を拡張するには、クラスに新しいメソッドを追加します。
jQuery.fn.extend(object); jQuery オブジェクトにメソッドを追加します。これは簡単に理解できるはずです。例えば。

コードをコピーします

コードは次のとおりです:

:18px;">
</タイトル> </頭> <a href="http://www.php.cn/wiki/807.html" target="_blank"><h3 class="ye">新しい魂</h3> h3 class= "ye">新しい魂</h3> </a><h3 class="ye">新しい魂</h3> <script type="text/ javascript " src="jquery.2.0 .3.js"></script> <script type="text/javascript"> jQuery.fn.myPlugin = function(options) { $options = $.extend( { html: "メッセージはありません" , css: { "color": "red", <a href="http://www.php.cn/wiki/48.html" target="_blank">"font-size":"14px" </a>}}, options); return $(this).css({ "color": $options.css.color, }).html($options.html); $('.ye').myPlugin({html:"簡単ですね?",css:{" color": "green","font-size":"20px"}}); </script> </body> </html> $.extend() の使用法も少し見ました。 1. 複数のオブジェクトを結合します。 ここで使用しているのは$.extend()の複数のオブジェクトをネストする機能です。 複数のオブジェクトのいわゆるネストは、配列を結合する操作に似ています。 しかし、ここにオブジェクトがあります。例えば。 コードをコピーします コードは次のとおりです: //使用法: jQuery.extend(obj1,obj2,obj3,..) var Css1={ サイズ: "10px",style: "oblique"} var Css2={size: "12px",style: "oblique",weight: "bolder"} $.jQuery.extend(Css1,Css2) //結果 : Css1 の size 属性 が上書きされ、 Css2 の Weight 属性 が継承されます // Css1 = {size: "12px"、style: "oblique"、weight: "bolder"} 2. 深くネストされたオブジェクト。 <a href="http://www.php.cn/wiki/169.html" target="_blank"></a><a href="http://www.php.cn/code/6064.html" target="_blank">コードをコピーします</a> コードは次のとおりです: jQuery.extend( { name: "John", location: { city: "Boston " } } , { last: “Resig”, location: { state: “MA” } } ); // result: // => { name: “John”, last: “Resig”, location : { state : "MA" } } // New Deeper.extend() jQuery.extend( true, { name: "John", location: { city: "Boston" } }, { last: "Resig ", location: { state: "MA" } } ); // result // => { name: "John", last: "Resig", // location: { city: "Boston", state: "MA" } } 3. jQuery に static メソッドを追加できます。 コードをコピーします コードは次のとおりです: <html> <title>
< /head>

人気のチュートリアル

詳細>