Heim >Web-Frontend >js-Tutorial >Zusammenfassung der Verwendung von extension() in jQuery

Zusammenfassung der Verwendung von extension() in jQuery

黄舟Original: 2017-12-04 09:22:121467Durchsuche

In unserer täglichen Entwicklungsarbeit ist die Verwendung von jQuery unverzichtbar. Ich glaube daher, dass viele Freunde die Verwendung von extension () in jQuery verwenden werden. Deshalb werden wir es Ihnen heute im Detail vorstellen die Zusammenfassung der Verwendung von extension() in jQuery!

jQuery bietet zwei Methoden zum Entwickeln von Plug-Ins:

jQuery.fn.extend(object); 
jQuery.extend(object);

jQuery.extend(object); zum Erweitern der jQuery-Klasse selbst Klassenmethode.
jQuery.fn.extend(object); Methoden zu jQuery-Objekten hinzufügen. Dies sollte leicht zu verstehen sein. Geben Sie ein Beispiel.

Der Code lautet wie folgt:

<span style="font-size:18px;"><html> 
<head> 
<title></title> 
</head> 
<body> 
<h3 class="ye">new soul</h3> 
<h3 class="ye">new soul</h3> 
<h3 class="ye">new soul</h3> 
<h3 class="ye">new soul</h3> 
<script type="text/javascript" src="jquery.2.0.3.js"></script> 
<script type="text/javascript"> 
jQuery.fn.myPlugin = function(options) { 
$options = $.extend( { 
html: "no messages", 
css: { 
"color": "red", 
"font-size":"14px" 
}}, 
options); 
return $(this).css({ 
"color": $options.css.color, 
}).html($options.html); 
} 
$(&#39;.ye&#39;).myPlugin({html:"So easy,yes?",css:{"color":"green","font-size":"20px"}}); 
</script> 
</body> 
</html> 
</span>

Okay, Sie haben oben auch eine kleine Verwendung von $.extend() gesehen.

1. Mehrere Objekte zusammenführen.
Was hier verwendet wird, ist die Funktion zum Verschachteln mehrerer Objekte von $.extend().
Die sogenannte Verschachtelung mehrerer Objekte ähnelt in gewisser Weise dem Vorgang des Zusammenführens von Arrays.
Aber hier sind die Objekte. Nennen Sie Beispiele.

Der Code lautet wie folgt:

<span style="font-size:18px;">//用法: jQuery.extend(obj1,obj2,obj3,..) 
var Css1={size: "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"} 
</span>

Tief verschachtelte Objekte.

Der Code lautet wie folgt:

<span style="font-size:18px;"> jQuery.extend( 
{ name: “John”, location: { city: “Boston” } }, 
{ last: “Resig”, location: { state: “MA” } } 
); 
// 结果: 
// => { name: “John”, last: “Resig”, location: { state: “MA” } } 
// 新的更深入的 .extend() 
jQuery.extend( true, 
{ name: “John”, location: { city: “Boston” } }, 
{ last: “Resig”, location: { state: “MA” } } 
); 
// 结果 
// => { name: “John”, last: “Resig”, 
// location: { city: “Boston”, state: “MA” } } 
</span>

3. Sie können statische Methoden zu jQuery hinzufügen.

Der Code lautet wie folgt:

<span style="font-size:18px;"><html> 
<head> 
<title></title> 
</head> 
<body> 
<script type="text/javascript" src="jquery.2.0.3.js"></script> 
<script type="text/javascript"> 
$.extend({ 
add:function(a,b){return a+b;}, 
minus:function(a,b){return a-b}, 
multiply:function(a,b){return a*b;}, 
pide:function(a,b){return Math.floor(a/b);} 
}); 
var sum = $.add(3,5)+$.minus(3,5)+$.multiply(3,5)+$.pide(5,7); 
console.log(sum); 
</script> 
</body> 
</html>
</span>

Zusammenfassung:

Dieser Artikel stellt ihn Ihnen vor Durch die ausführliche Einführung von Beispielen habe ich etwas über die Verwendung von „extend()“ in jQuery gelernt. Ich hoffe, dass es für Ihre Arbeit hilfreich sein wird.

Verwandte Empfehlungen:

JQuerys erweiterte Methodenanalyse

Detaillierte Einführung und Verwendung der Extend-Nutzung in JQuery

Detaillierte Erläuterung von Anwendungsbeispielen der jQuery.extend-Funktion

Das obige ist der detaillierte Inhalt vonZusammenfassung der Verwendung von extension() in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：jquery dom lernenNächster Artikel：jquery dom lernen

In Verbindung stehende Artikel

Mehr sehen