Концепцията за гетери и сетери в JavaScript е само едно от нещата, които трябва да разберете. Те са добри в jQuery, защото API е толкова последователен, че след като го получите, можете почти да предположите как ще работи за различни методи. На най-основното ниво ...
Сетерите правят нещо.
Гетерите връщат стойност .
Често един метод може да се използва по един или друг начин. Вземете например метода на височината.
// Used as a "setter" - will set the height $("#example").height(100); // Used as a "getter" - will return a value var theHeight = $("#example").height();Виждате ли разликата? Настройчикът предава параметър, когато се използва методът. Гетерът не предава нищо . Така самият jQuery знае какво да прави. Той просто тества дали има параметър там или не. Ако не, то се държи като гетьор. Ако е там, той се държи като сетер. Това е просто приятно удобство на API, вместо да има отделни методи като getHeight и setHeight.
Струва си да се отбележи, че гетерът, използван сам по себе си, не прави нищо.
// Useless $("#example").height();И ако зададете стойността на променлива с помощта на сетер, ще получите върнат обект jQuery.
// x will be a jQuery object containing #example var x = $("#example").height(100);Това може да е объркващо за косата, но и чудесен малък трик за спестяване на код. Ако знаете, че трябва да кеширате този обект jQuery и да зададете височината му, може и да го направите в един ред код.
Вижте писалката 8ff68485673396d452f650bfb437fb2a от Chris Coyier (@chriscoyier) на CodePen
Също така в статията се споменава box-sizing: border-box;. Оразмеряването на кутията е супер полезно свойство на CSS. Аз съм голям поддръжник да го настроя за всички елементи, като:
* ( box-sizing: border-box; )Както беше отбелязано във видеото, това също прави height()jQuery малко по-предсказуем и последователен. Без набор от рамки, height()е равно на свойството височина в CSS или каквато и да е височината на елемента, естествено, минус подложката и границата. С border-boxset height()е точно колко висока височина заема този елемент на екрана, включително подложка и граница. Без да border-boxзададете, за да го получите, трябва да използвате outerHeight()в jQuery.