# 09: Getters un Setters - CSS-triki

Anonim

Getters un seteru jēdziens JavaScript ir tikai viena no tām lietām, kas jums būtu jāsaprot. Viņi ir jauki jQuery, jo API ir tik konsekventa, ka, tiklīdz jūs to saņemat, jūs varat diezgan vienkārši uzminēt, kā tas darbosies ar dažādām metodēm. Pamata līmenī…

Seteri kaut ko izdara .
Getters atgriež vērtību .

Bieži vien vienu metodi var izmantot jebkurā veidā. Piemēram, izmantojiet augstuma metodi.

// Used as a "setter" - will set the height $("#example").height(100); // Used as a "getter" - will return a value var theHeight = $("#example").height();

Redzi atšķirību? Iestatītājs nodod parametru, kad tiek izmantota metode. Getter neko neiztur . Tā jQuery pats zina, ko darīt. Tas tikai pārbauda, ​​vai tur ir kāds parametrs, vai nav. Ja nē, tas izturas kā getter. Ja tas ir tur, tas izturas kā iestatītājs. Tas ir tikai jauks API ērtums, nevis atsevišķas metodes, piemēram, getHeight un setHeight.

Ir vērts atzīmēt, ka pats izmantotais getter neko nedara.

// Useless $("#example").height();

Un, ja mainītāja vērtību iestatāt, izmantojot iestatītāju, tiks atgriezts objekts jQuery.

// x will be a jQuery object containing #example var x = $("#example").height(100);

Tas var būt neskaidrs mats, bet arī veikls mazs triks koda saglabāšanai. Ja jūs zināt, ka jQuery objekts ir jāmaina gan kešatmiņā, gan jāiestata tā augstums, to varētu izdarīt arī vienā koda rindā.

Skatiet Chris Coyier (@chriscoyier) pildspalvu 8ff68485673396d452f650bfb437fb2a vietnē CodePen

Rakstā minēts arī box-sizing: border-box;. Kastīšu izmērs ir ļoti noderīgs CSS īpašums. Es esmu liels proponents, lai to iestatītu visiem elementiem, piemēram:

* ( box-sizing: border-box; )

Kā atzīmēts videoklipā, tas arī padara height()jQuery mazliet paredzamāku un konsekventāku. Bez apmales komplekta height()ir vienāds ar augstuma rekvizītu CSS vai jebkuru augstumu, kāds dabiski ir, atskaitot polsterējumu un apmali. Ar border-boxiestatījumu height()ir precīzi noteikts, cik liels augstums šis elements aizņem ekrānā, ieskaitot polsterējumu un apmali. Bez border-boxiestatījuma, lai to iegūtu, jums jālieto outerHeight()jQuery.