„JavaScript“ įtraukimo ir nustatymo koncepcija yra tik vienas iš tų dalykų, kuriuos turėtumėte suprasti. Jie yra gražūs „jQuery“, nes API yra tokia nuosekli, kad ją gavę, galite beveik atspėti, kaip ji veiks taikant įvairius metodus. Pagrindiniu lygiu…
Setters kažką daro .
Getters pateikia vertę .
Dažnai vieną metodą galima naudoti bet kuriuo atveju. Pavyzdžiui, paimkite aukščio metodą.
// Used as a "setter" - will set the height $("#example").height(100); // Used as a "getter" - will return a value var theHeight = $("#example").height();Matote skirtumą? Kai naudojamas metodas, seteris perduoda parametrą . Getter nieko nepraeina . Štai kaip „jQuery“ žino, ką daryti. Jis tiesiog patikrina, ar ten yra parametras, ar ne. Jei ne, tai elgiasi kaip getter. Jei jis yra, jis elgiasi kaip nustatytojas. Tai tik puikus API patogumas, užuot turėjęs atskirus metodus, pvz., „GetHeight“ ir „setHeight“.
Verta paminėti, kad pats naudojamas naudojimasis nieko nedaro.
// Useless $("#example").height();Ir jei nustatysite kintamojo vertę naudodami seterį, gausite „jQuery“ objektą.
// x will be a jQuery object containing #example var x = $("#example").height(100);Tai gali būti painus plaukas, bet ir puikus mažas kodo taupymo triukas. Jei žinote, kad turite tą „jQuery“ objektą talpinti ir nustatyti jo aukštį, taip pat galite tai padaryti vienoje kodo eilutėje.
Žiūrėkite Chrisą Coyierį (@chriscoyier) „CodePen“ rašiklį 8ff68485673396d452f650bfb437fb2a
Straipsnyje taip pat paminėta box-sizing: border-box;. Dėžutės dydis yra labai naudinga CSS nuosavybė. Aš esu didelis šalininkas, nustatantis jį visiems elementams, pavyzdžiui:
* ( box-sizing: border-box; )Kaip pažymėta vaizdo įraše, tai taip pat daro height()„jQuery“ šiek tiek labiau nuspėjamą ir nuoseklų. Be rėmelio rinkinio height()yra lygus CSS aukščio savybei arba bet kokiam natūraliai elemento aukščiui, atėmus paminkštinimą ir kraštinę. Su border-boxrinkiniu height()tiksliai nurodoma, kiek elementas užima ekrano aukštį, įskaitant paminkštinimą ir kraštinę. Jei border-boxnenorite nustatyti, kad tai gautumėte, turite naudoti outerHeight()„jQuery“.