jQuery はプラグインを開発するための 2 つのメソッドを提供します。jQuery.extend(object); jQuery.extend(object);クラス自体に新しいメソッドを追加します。 jQuery.fn.extend(object); jQuery オブジェクトにメソッドを追加します。これは簡単に理解できるはずです。例を挙げてみましょう。 コードをコピー コードは次のとおりです: 新しい魂 新しい魂 新しい魂 ; 新しい魂 ; <br>jQuery.fn.myPlugin = function(options) { <br>$options = $.extend( { <br>html: "メッセージなし" , <br>css: { <br>"color": "red", <br>"font-size":"14px" <br>}}, <br>return $(this); .css( { <br>"color": $options.css.color, <br><br>}).html($options.html) <br>} <br><br><br>$( '.ye ').myPlugin({html:"とても簡単ですね?",css:{"color":"green","font-size":"20px"}}); ; <br></body> <br></html> <br><br> <br>上で $.extend() の使い方も少し見ました。 <br><br>1. 複数のオブジェクトを結合します。 <br> </div>ここで使用しているのは$.extend()の複数のオブジェクトをネストする機能です。 <br><br>複数のオブジェクトのいわゆるネストは、配列を結合する操作に似ています。 <br><br>しかし、ここにオブジェクトがあります。例を挙げてください。 <br><br><br><br><br>コードをコピー<br><div class="codetitle"> <span> コードは次のとおりです:<a style="CURSOR: pointer" data="49269" class="copybut" id="copybut49269" onclick="doCopy('code49269')"><u> </u><span style="font-size :18px; ">//使用法: jQuery.extend(obj1,obj2,obj3,..) </a>var Css1={size: "10px",style: "oblique"} </span>var Css2={size : "12px ",style: "oblique",weight: "bolder"} </div>$.jQuery.extend(Css1,Css2) <div class="codebody" id="code49269">//結果: Css1 の size 属性は上書きされ、Css2 のweight 属性は上書きされますは継承されます<br>// Css1 = {size: "12px"、style: "oblique"、weight: "bolder"} <br></span> <br><br> <br>2. 。 <br><br><br> </div> <br>コードをコピー<br><div class="codetitle"> <span> コードは次のとおりです:<a style="CURSOR: pointer" data="27243" class="copybut" id="copybut27243" onclick="doCopy('code27243')"><u> </u><span style="font-size :18px; "> jQuery.extend( </a>{ 名前: "ジョン"、場所: { 都市: "ボストン" } }、</span>{ 最後: "Resig"、場所: { 州: "MA" } } </div>); <div class="codebody" id="code27243">// 結果: <br>// => { 名前: "John"、姓: "Resig"、場所: { 状態: "MA" } } <br>// 新しいさらに詳細な .extend() <br>jQuery.extend( true, <br>{ name: "John", location: { city: "Boston" } }, <br>{ last: "Resig", location : { 状態: "MA" } } <br>); <br>// 結果<br>// => { 名前: "ジョン"、姓: "Resig"、<br>// 場所: { 都市: "Boston" 、state: "MA" } } <br></span> <br><br> <br>3. jQuery に静的メソッドを追加できます。 <br><br><br> </div> <br>コードをコピー<br><div class="codetitle"> <span> コードは次のとおりです:<a style="CURSOR: pointer" data="66764" class="copybut" id="copybut66764" onclick="doCopy('code66764')"><u> </u><span style="font-size :18px; "><html> </a><head> </span><title></title> </div></head> <div class="codebody" id="code66764"><body> <br><スクリプトtype=" text/javascript" src="jquery.2.0.3.js"> >add: function(a,b){return a b;}、<br>minus:function(a,b){return a-b}、<br>multiply:function(a,b){return a*b;}、 <br> dive:function(a,b){return Math.floor(a/b);} <br>}); <br><br>var sum = $.add(3,5) $.minus( 3,5 ) $.multiply(3,5) $.divide(5,7); <br><br> </html></span><br><br> </div>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
