ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery $.extend() の使用法の概要

jQuery $.extend() の使用法の概要

巴扎黑
巴扎黑オリジナル
2017-07-09 11:59:171666ブラウズ

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