13 maart 2009

De zoete Chainability

Geplaatst door: Mahbub In: Methoden

Een van de beste ding over jQuery is dat de keten staat voor bijna al zijn methoden. Als "ketting staat" klinkt hebreeuws, hier is een kleine uitleg wat het is.

chain

Laten we zeggen dat je een <div id="myDiv"> Lorem Ipsum </ div>

En je moet het volgende doen

  1. Verander de hoogte 150px
  2. Verander de dekking tot 0,8
  3. Voeg een klasse met de naam "pClass"
  4. En stelt u de tekst in de div als "We are the world"

Dus, wat zou u doen in normale omstandigheden? Je schrijft vier regels code. Net als je jQuery in de conventionele manier zou je waarschijnlijk schrijven

  1
 2
 3
 4
  ) . css ( "height" , "150px" ) ; $ ("# MyDiv") css ("height", "150px").;
 ) . fadeTo ( 500 , 0.8 ) ; $ ("# MyDiv") fadeTo (500, 0.8).; 
 ) . addClass ( "pClass" ) ; . $ ("# MyDiv") addClass ("pClass"); 
 ) . text ( "We are the world" ) ; $ ("# MyDiv") tekst ("We are the world").; 

Maar als we gebruik maken van methode chaininig we zouden gewoon schrijven

  ) . css ( "height" , "150px" ) . fadeTo ( 500 , 0.8 ) . addClass ( "pClass" ) . text ( "We are the world" ) ; .. $ ("# MyDiv") css ("height", "150px") fadeTo (500, 0,8) addClass ("pClass") tekst ("We are the world")..; 

Ziet er rommelig? Ik denk het niet. Het is leesbaar tenzij je heel wat manieren om een ​​object dat is zeer onwaarschijnlijk. Dus dat is chaining.

Achter de schermen, is het koppelen eenvoudig door het terugzenden van het object itselft na het toepassen van de methode. Het is heel graag hoe we kunnen gebruiken die in JavaScript-object, zoals

  "Lorem Ipsum Dolor" ; var MyString = "Lorem ipsum dolor"; 
  ( ) . substring ( 0 , 5 ) ; .. pString = MyString toLowerCase () substring (0, 5); 

En dit is een geschenk als we opties om dingen te doen zoals die moeten. Wie wil schrijven meer code als er zijn manieren om het kort te houden? Tenminste ik niet. Dus vrijwel alle van de volgende

in jQuery heeft deze chainability. Alle methoden die keten, geeft de gehele jQuery object zelf, zodat meer methoden kunnen worden toegepast.

U kunt de bovenstaande code draait hier .

No Responses to "De zoete Chainability"

Reactie formulier


Vertaler

English flagItalian flagKorean flagChinese (Simplified) flagChinese (Traditional) flagPortuguese flagGerman flagFrench flagSpanish flagJapanese flagArabic flagRussian flagGreek flagDutch flagBulgarian flagCzech flagCroatian flagDanish flagFinnish flagHindi flagPolish flagRomanian flagSwedish flagNorwegian flagCatalan flagFilipino flagHebrew flagIndonesian flagLatvian flagLithuanian flagSerbian flagSlovak flagSlovenian flagUkrainian flagVietnamese flagAlbanian flagEstonian flagGalician flagMaltese flagThai flagTurkish flagHungarian flag

Labels