Spread syntax

More

Fullscreen VideoModal BoxesDelete ModalTimelineScroll IndicatorProgress BarsSkill BarRange SlidersTooltipsDisplay Element HoverPopupsCollapsibleCalendarHTML IncludesTo Do ListLoadersStar RatingUser RatingOverlay EffectContact ChipsCardsFlip CardProfile CardProduct CardAlertsCalloutNotesLabelsCirclesStyle HRCouponList GroupList Without BulletsResponsive TextCutout TextGlowing TextFixed FooterSticky ElementEqual HeightClearfixResponsive FloatsSnackbarFullscreen WindowScroll DrawingSmooth ScrollGradient Bg ScrollSticky HeaderShrink Header on ScrollPricing TableParallaxAspect RatioResponsive IframesToggle Like/DislikeToggle Hide/ShowToggle Dark ModeToggle TextToggle ClassAdd ClassRemove ClassActive ClassTree ViewRemove PropertyOffline DetectionFind Hidden ElementRedirect WebpageZoom HoverFlip BoxCenter VerticallyCenter Button in DIVTransition on HoverArrowsShapesDownload LinkFull Height ElementBrowser WindowCustom ScrollbarHide ScrollbarDevice LookContenteditable BorderPlaceholder ColorText Selection ColorBullet ColorVertical LineDividersAnimate IconsCountdown TimerTypewriterComing Soon PageChat MessagesPopup Chat WindowSplit ScreenTestimonialsSection CounterQuotes SlideshowClosable List ItemsTypical Device BreakpointsDraggable HTML ElementJS Media QueriesSyntax HighlighterJS AnimationsGet Iframe Elements

Menus

Icon BarMenu IconAccordionTabsVertical TabsTab HeadersFull Page TabsHover TabsTop NavigationResponsive TopnavNavbar with IconsSearch MenuSearch BarFixed SidebarSide NavigationResponsive SidebarFullscreen NavigationOff-Canvas MenuHover Sidenav ButtonsSidebar with IconsHorizontal Scroll MenuVertical MenuBottom NavigationResponsive Bottom NavBottom Border Nav LinksRight Aligned Menu LinksCentered Menu LinkEqual Width Menu LinksFixed MenuSlide Down Bar on ScrollHide Navbar on ScrollShrink Navbar on ScrollSticky NavbarNavbar on ImageHover DropdownsClick DropdownsDropdown in TopnavDropdown in SidenavResp Navbar DropdownSubnavigation MenuDropupMega MenuMobile MenuCurtain MenuCollapsed SidebarCollapsed SidepanelPaginationBreadcrumbsButton GroupVertical Button GroupSticky Social BarPill NavigationResponsive Header

How To Create a Popup Form

Step 1) Add HTML

Use a <form> element to process the input. You can learn more about this in our PHP tutorial.


Example

Step 2) Add CSS:

Example

{box-sizing: border-box;}/* Button used to open the contact form — fixed at the bottom of the page */.open-button {  background-color: #555;  color: white;  padding: 16px 20px;  border: none;  cursor: pointer;  opacity: 0.8;  position: fixed;  bottom: 23px;  right: 28px;  width: 280px;}/* The popup form — hidden by default */.form-popup {  display: none;  position: fixed;  bottom: 0;  right: 15px;  border: 3px solid #f1f1f1;  z-index: 9;}/* Add styles to the form container */.form-container {  max-width: 300px;  padding: 10px;  background-color: white;}/* Full-width input fields */.form-container input, .form-container input {  width: 100%;  padding: 15px;  margin: 5px 0 22px 0;  border: none;  background: #f1f1f1; }/* When the inputs get focus, do something */.form-container input:focus, .form-container input:focus {  background-color: #ddd;  outline: none;}/* Set a style for the submit/login button */ .form-container .btn {  background-color: #4CAF50;  color: white;  padding: 16px 20px;  border: none;  cursor: pointer;  width: 100%;  margin-bottom:10px;  opacity: 0.8;}/* Add a red background color to the cancel button */.form-container .cancel {  background-color: red;}/* Add some hover effects to buttons */.form-container .btn:hover, .open-button:hover {  opacity: 1;}

Step 3) Add JavaScript:

Example

function openForm() {  document.getElementById(«myForm»).style.display = «block»;}function closeForm() {  document.getElementById(«myForm»).style.display = «none»;}

Tip: Go to our HTML Form Tutorial to learn more about HTML Forms.

Tip: Go to our CSS Form Tutorial to learn more about how to style form elements.

Синтаксис

Параметры

Индекс, по которому начинает изменять массив. Если больше длины массива, реальный индекс будет установлен на длину массива. Если отрицателен, указывает индекс элемента с конца.
Целое число, показывающее количество старых удаляемых из массива элементов. Если равен 0, элементы не удаляются. В этом случае вы должны указать как минимум один новый элемент. Если больше количества элементов, оставшихся в массиве, начиная с индекса , то будут удалены все элементы до конца массива.
Необязательные параметры. Добавляемые к массиву элементы. Если вы не укажете никакого элемента, просто удалит элементы из массива.

Возвращаемое значение

Массив, содержащий удалённые элементы. Если будет удалён только один элемент, вернётся массив из одного элемента. Если никакие элементы не будут удалены, вернётся пустой массив.

JavaScript

JS Array concat() constructor copyWithin() entries() every() fill() filter() find() findIndex() forEach() from() includes() indexOf() isArray() join() keys() length lastIndexOf() map() pop() prototype push() reduce() reduceRight() reverse() shift() slice() some() sort() splice() toString() unshift() valueOf()

JS Boolean constructor prototype toString() valueOf()

JS Classes constructor() extends static super

JS Date constructor getDate() getDay() getFullYear() getHours() getMilliseconds() getMinutes() getMonth() getSeconds() getTime() getTimezoneOffset() getUTCDate() getUTCDay() getUTCFullYear() getUTCHours() getUTCMilliseconds() getUTCMinutes() getUTCMonth() getUTCSeconds() now() parse() prototype setDate() setFullYear() setHours() setMilliseconds() setMinutes() setMonth() setSeconds() setTime() setUTCDate() setUTCFullYear() setUTCHours() setUTCMilliseconds() setUTCMinutes() setUTCMonth() setUTCSeconds() toDateString() toISOString() toJSON() toLocaleDateString() toLocaleTimeString() toLocaleString() toString() toTimeString() toUTCString() UTC() valueOf()

JS Error name message

JS Global decodeURI() decodeURIComponent() encodeURI() encodeURIComponent() escape() eval() Infinity isFinite() isNaN() NaN Number() parseFloat() parseInt() String() undefined unescape()

JS JSON parse() stringify()

JS Math abs() acos() acosh() asin() asinh() atan() atan2() atanh() cbrt() ceil() cos() cosh() E exp() floor() LN2 LN10 log() LOG2E LOG10E max() min() PI pow() random() round() sin() sqrt() SQRT1_2 SQRT2 tan() tanh() trunc()

JS Number constructor isFinite() isInteger() isNaN() isSafeInteger() MAX_VALUE MIN_VALUE NEGATIVE_INFINITY NaN POSITIVE_INFINITY prototype toExponential() toFixed() toLocaleString() toPrecision() toString() valueOf()

JS OperatorsJS RegExp constructor compile() exec() g global i ignoreCase lastIndex m multiline n+ n* n? n{X} n{X,Y} n{X,} n$ ^n ?=n ?!n source test() toString() (x|y) . \w \W \d \D \s \S \b \B \0 \n \f \r \t \v \xxx \xdd \uxxxx

JS Statements break class continue debugger do…while for for…in for…of function if…else return switch throw try…catch var while

JS String charAt() charCodeAt() concat() constructor endsWith() fromCharCode() includes() indexOf() lastIndexOf() length localeCompare() match() prototype repeat() replace() search() slice() split() startsWith() substr() substring() toLocaleLowerCase() toLocaleUpperCase() toLowerCase() toString() toUpperCase() trim() valueOf()

How To Create Popups

Step 1) Add HTML:

<div class=»popup» onclick=»myFunction()»>Click me!  <span class=»popuptext» id=»myPopup»>Popup text…</span></div>

Step 2) Add CSS:

/* Popup container */.popup {  position: relative;  display: inline-block;  cursor: pointer;}/* The actual popup (appears on top) */.popup .popuptext {  visibility: hidden;  width: 160px;  background-color: #555;  color: #fff;  text-align: center;  border-radius: 6px;  padding: 8px 0;  position: absolute;  z-index: 1;  bottom: 125%;  left: 50%;   margin-left: -80px;}/* Popup arrow */.popup .popuptext::after {  content: «»;   position: absolute;  top: 100%;  left: 50%;  margin-left: -5px;  border-width: 5px;  border-style: solid;   border-color: #555 transparent transparent transparent;}/* Toggle this class when clicking on the popup container (hide and show the popup) */.popup .show {  visibility: visible;  -webkit-animation: fadeIn 1s;  animation: fadeIn 1s}/* Add animation (fade in the popup) */ @-webkit-keyframes fadeIn {  from {opacity: 0;}   to {opacity: 1;}}@keyframes fadeIn {  from {opacity: 0;}  to {opacity:1 ;}}

Step 3) Add JavaScript:

<script>// When the user clicks on <div>, open the popupfunction myFunction() {  var popup = document.getElementById(«myPopup»);  popup.classList.toggle(«show»);}</script>

Действия по умолчанию

Действия по умолчанию весьма разнообразны, много чего можно инициировать нажатием на клавиатуре.

Для примера:

  • Появление символа (самое очевидное).
  • Удаление символа (клавиша Delete).
  • Прокрутка страницы (клавиша PageDown).
  • Открытие диалогового окна браузера «Сохранить» (Ctrl+S)
  • …и так далее.

Предотвращение стандартного действия с помощью работает практически во всех сценариях, кроме тех, которые происходят на уровне операционной системы. Например, комбинация Alt+F4 инициирует закрытие браузера в Windows, что бы мы ни делали в JavaScript.

Для примера, ниже ожидает телефонный номер, так что ничего кроме чисел, , или принято не будет:

Заметьте, что специальные клавиши, такие как Backspace, Left, Right, Ctrl+V, в этом поле для ввода не работают. Это побочный эффект чересчур жёсткого фильтра .

Добавим ему немного больше свободы:

Теперь стрелочки и удаление прекрасно работают.

…Впрочем, мы всё равно можем ввести в что угодно с помощью правого клика мыши и пункта «Вставить» контекстного меню. Так что такой фильтр не обладает 100% надёжностью. Мы можем просто оставить всё как есть, потому что в большинстве случаев это работает. Альтернатива – отслеживать событие , оно генерируется после любых изменений в поле , и мы можем проверять новое значение и подчёркивать/изменять его, если оно не подходит.

Основа основ

Есть 4 вещи, которые вы должны знать при работе с массивами — это , , и spread-оператор. Они являются мощным базисом.

map

Вероятнее всего, вы часто сталкивались с этим методом. Его используют, когда нужно поэлементно трансформировать массив в новый.

Метод принимает всего один параметр — функцию, которая вызывается при каждой итерации по массиву. Метод возвращает новый массив, а не изменяет существующий.

Подобным образом можно получить массив, содержащий в себе только одно свойство объекта:

Поэтому, если нужно поэлементно трансформировать массив в новый — используйте .

filter

В принципе имя метода говорит само за себя: он используется тогда, когда нужно произвести фильтрацию массива.

Как и , метод принимает только один параметр — функцию, которая вызывается при каждой итерации. Функция должна возвращать булево значение:

  • — элемент остаётся в новом массиве,
  • — элемент не остаётся в новом массиве.

После этого вы получаете отфильтрованный массив с нужными вам элементами.

Frontend developer (Vue)

Sportmaster Lab, Липецк, до 130 000 ₽

tproger.ru

Вакансии на tproger.ru

К примеру, сохраним только нечётные числа в массиве:


Или же можно удалять строго определённые элементы массива:

reduce

Возможно, это довольно сложный для понимания метод. Но однажды вы поймёте, сколько крутых штук можно сделать с его помощью.

Метод предназначен для комбинации значений массива в одно значение. Метод принимает два параметра. Первый из них — callback-функция (), второй — первичное значение, которое является необязательным и по-умолчанию является первым элементом массива. Callback-функция принимает 4 аргумента:

  • accumulator (он хранит в себе промежуточный результат итераций),
  • текущее значение массива,
  • текущий ,
  • сам массив.

В большинстве случаев вам достаточно будет первых двух аргументов: промежуточного результата и текущего значения.

Поначалу это может звучать сложно, но на примерах всё разъяснится. Вот самый простой из них:

При первой итерации переменная (промежуточный результат) принимает значение 37. Возвращаемое значение равно , где n равняется 12, т. е. значение равно 49. При второй итерации промежуточный результат равен 49 и к нему прибавляется 28. Теперь равен 77. И так далее.

Метод настолько хорош, что с его помощью можно создавать остальные методы массива, например или :

В случае запускается функция, результат которой добавляется в конец accumulator’а с помощью spread-оператора. В почти то же самое, за исключением того, что на каждом элементе запускается filter-функция. Если эта функция возвращает , то возвращается предыдущий массив (промежуточное значение), иначе элемент добавляется в конец массива.

Вот более сложный пример: функция, которая «сглаживает» массив рода в одномерный массив .

Принцип работы схож с , только с щепоткой рекурсии.

Spread оператор (стандарт ES2015)

Несмотря на то что оператор не является методом, с его помощью можно добиться многого при работе с массивами. Например, можно делать копии массивов или же объединять несколько массивов в один.

Обратите внимание, что этот оператор создаёт поверхностную копию исходного массива. Но что значит?. При поверхностном копировании элементы массива дублируются минимальным образом

Если, скажем, массив состоит только из примитивов (числа, строки, булевы значения), то это не вызовет никаких проблем. Но нельзя сказать то же самое о массиве объектов. При поверхностном копировании объектов в массиве созданные (продублированные) элементы ссылаются на оригиналы. Следовательно, если вы попытаетесь изменить объект в массиве, то изменения будут отражаться и на всех продублированных с него объектах (так же и в обратную сторону)

При поверхностном копировании элементы массива дублируются минимальным образом. Если, скажем, массив состоит только из примитивов (числа, строки, булевы значения), то это не вызовет никаких проблем. Но нельзя сказать то же самое о массиве объектов. При поверхностном копировании объектов в массиве созданные (продублированные) элементы ссылаются на оригиналы. Следовательно, если вы попытаетесь изменить объект в массиве, то изменения будут отражаться и на всех продублированных с него объектах (так же и в обратную сторону).

Поэтому если вам нужно сделать полную копию массива, содержащего объекты, то можно воспользоваться функцией из библиотеки lodash.

JavaScript Bitwise Operators

Bit operators work on 32 bits numbers. Any numeric operand in the operation is converted into a 32 bit number. The result is converted back to a JavaScript number.

Operator Description Example Same as Result Decimal
& AND x = 5 & 1 0101 & 0001 0001  1
| OR x = 5 | 1 0101 | 0001 0101  5
~ NOT x = ~ 5  ~0101 1010  10
^ XOR x = 5 ^ 1 0101 ^ 0001 0100  4
<< Left shift x = 5 << 1 0101 << 1 1010  10
>> Right shift x = 5 >> 1 0101 >> 1 0010   2

The examples above uses 4 bits unsigned examples. But JavaScript uses 32-bit signed numbers. Because of this, in JavaScript, ~ 5 will not return 10. It will return -6. ~00000000000000000000000000000101 will return 11111111111111111111111111111010

События keydown и keyup

Событие происходит при нажатии клавиши, а – при отпускании.

Свойство объекта события позволяет получить символ, а свойство – «физический код клавиши».

К примеру, одну и ту же клавишу Z можно нажать с клавишей Shift и без неё. В результате получится два разных символа: в нижнем регистре и в верхнем регистре.

Свойство – это непосредственно символ, и он может различаться. Но всегда будет тот же:

Клавиша
Z (нижний регистр)
Shift+Z (Верхний регистр)

Если пользователь работает с разными языками, то при переключении на другой язык символ изменится с на совершенно другой. Получившееся станет новым значением , тогда как останется тем же: .

«KeyZ» и другие клавишные коды

У каждой клавиши есть код, который зависит от её расположения на клавиатуре. Подробно о клавишных кодах можно прочитать в спецификации о кодах событий UI.

Например:

  • Буквенные клавиши имеют коды по типу : , и т.д.
  • Коды числовых клавиш строятся по принципу: : , и т.д.
  • Код специальных клавиш – это их имя: , , и т.д.

Существует несколько широко распространённых раскладок клавиатуры, и в спецификации приведены клавишные коды к каждой из них.

Можно их прочитать в или просто нажмите нужную клавишу на выше и посмотрите.

Регистр важен: , а не

Выглядит очевидно, но многие всё равно ошибаются.


Пожалуйста, избегайте опечаток: правильно , а не . Условие работать не будет: первая буква в слове должна быть заглавная.

А что, если клавиша не буквенно-цифровая? Например, или , или какая-либо другая специальная клавиша? В таких случаях значение свойства примерно тоже, что и у :

Клавиша
F1
Backspace
Shift или

Обратите внимание, что точно указывает, какая именно клавиша нажата. Так, большинство клавиатур имеют по две клавиши Shift: слева и справа

уточняет, какая именно из них была нажата, в то время как сообщает о «смысле» клавиши: что вообще было нажато ().

Допустим, мы хотим обработать горячую клавишу Ctrl+Z (или Cmd+Z для Mac). Большинство текстовых редакторов к этой комбинации подключают действие «Отменить». Мы можем поставить обработчик событий на и проверять, какая клавиша была нажата.

Здесь возникает дилемма: в нашем обработчике стоит проверять значение или ?

С одной стороны, значение – это символ, он изменяется в зависимости от языка, и если у пользователя установлено в ОС несколько языков, и он переключается между ними, нажатие на одну и ту же клавишу будет давать разные символы. Так что имеет смысл проверять , ведь его значение всегда одно и тоже.

Вот пример кода:

С другой стороны, с тоже есть проблемы. На разных раскладках к одной и той же клавише могут быть привязаны разные символы.

Например, вот схема стандартной (US) раскладки («QWERTY») и под ней немецкой («QWERTZ») раскладки (из Википедии):

Для одной и той же клавиши в американской раскладке значение равно «Z», в то время как в немецкой «Y».

Буквально, для пользователей с немецкой раскладкой при нажатии на Y будет равен .

Если мы будем проверять в нашем коде , то для людей с немецкой раскладкой такая проверка сработает, когда они нажимают Y.

Звучит очень странно, но это и в самом деле так. В прямо упоминается такое поведение.

Так что может содержать неправильный символ при неожиданной раскладке. Одни и те же буквы на разных раскладках могут сопоставляться с разными физическими клавишами, что приводит к разным кодам. К счастью, это происходит не со всеми кодами, а с несколькими, например , , (как мы уже видели), и не происходит со специальными клавишами, такими как . Вы можете найти полный список проблемных кодов в .

Чтобы отслеживать символы, зависящие от раскладки, надёжнее.

С другой стороны, преимущество заключается в том, что его значение всегда остаётся неизменным, будучи привязанным к физическому местоположению клавиши, даже если пользователь меняет язык. Так что горячие клавиши, использующие это свойство, будут работать даже в случае переключения языка.

Хотим поддерживать клавиши, меняющиеся при раскладке? Тогда – верный выбор.

Или мы хотим, чтобы горячая клавиша срабатывала даже после переключения на другой язык? Тогда может быть лучше.

JavaScript Bitwise Operators

Bit operators work on 32 bits numbers.

Operator Description Example Same as Result Decimal
& AND 5 & 1 0101 & 0001 0001  1
| OR 5 | 1 0101 | 0001 0101  5
~ NOT ~ 5  ~0101 1010  10
^ XOR 5 ^ 1 0101 ^ 0001 0100  4
<< Zero fill left shift 5 << 1 0101 << 1 1010  10
>> Signed right shift 5 >> 1 0101 >> 1 0010   2
>>> Zero fill right shift 5 >>> 1 0101 >>> 1 0010   2

The examples above uses 4 bits unsigned examples. But JavaScript uses 32-bit signed numbers. Because of this, in JavaScript, ~ 5 will not return 10. It will return -6. ~00000000000000000000000000000101 will return 11111111111111111111111111111010

Bitwise operators are fully described in the JS Bitwise chapter.

Перебор элементов массива

Один из распространенных способов перебора элементов массива мы только что видели – это цикл for:

Например, для массива:

let fruits = "Яблоко", "Апельсин", "Груша";

перебрать его элементы можно так:

for(let i=;i < fruits.length; ++i)
    console.log( fruitsi );

мы увидим все значения элементов. Но есть и второй новый способ перебора с помощью цикла for of:

for(let value of fruits)
    console.log( value );

Эта запись короче, но имеет свои особенности: значения массива копируются в переменную value, то есть, внутри цикла мы имеем дело не с самими значениями массива fruits, а с их копиями. Например, из-за этого мы не можем менять значения элементов массива внутри такого цикла:

for(let value of fruits) {
     value = "none";
}
 
console.log(fruits);

В консоле мы увидим прежний массив. А вот через первый цикл так делать можно:

for(let i=;i < fruits.length; ++i)
    fruitsi = "none";

Преимуществом цикла for of является его оптимизация под массивы. В частности, он работает в 10-100 раз быстрее цикла for in, который мы рассматривали ранее, для перебора свойств объекта. Формально, мы могли бы использовать и его:

for(let key in fruits)
    console.log( fruitskey );

Но это будет медленнее и к тому же там мы будем перебирать все публичные ключи массива, а не только целочисленные, которые являются индексами элементов массива. В общем, вывод такой. Нужно перебрать массив, используйте или обычный цикл for или цикл for of.

Видео по теме

JavaScipt #1: что это такое, с чего начать, как внедрять и запускать

JavaScipt #2: способы объявления переменных и констант в стандарте ES6+

JavaScript #3: примитивные типы number, string, Infinity, NaN, boolean, null, undefined, Symbol

JavaScript #4: приведение типов, оператор присваивания, функции alert, prompt, confirm

JavaScript #5: арифметические операции: +, -, *, /, **, %, ++, —

JavaScript #6: условные операторы if и switch, сравнение строк, строгое сравнение

JavaScript #7: операторы циклов for, while, do while, операторы break и continue

JavaScript #8: объявление функций по Function Declaration, аргументы по умолчанию


JavaScript #9: функции по Function Expression, анонимные функции, callback-функции

JavaScript #10: анонимные и стрелочные функции, функциональное выражение

JavaScript #11: объекты, цикл for in

JavaScript #12: методы объектов, ключевое слово this

JavaScript #13: клонирование объектов, функции конструкторы

JavaScript #14: массивы (array), методы push, pop, shift, unshift, многомерные массивы

JavaScript #15: методы массивов: splice, slice, indexOf, find, filter, forEach, sort, split, join

JavaScript #16: числовые методы toString, floor, ceil, round, random, parseInt и другие

JavaScript #17: методы строк — length, toLowerCase, indexOf, includes, startsWith, slice, substring

JavaScript #18: коллекции Map и Set

JavaScript #19: деструктурирующее присваивание

JavaScript #20: рекурсивные функции, остаточные аргументы, оператор расширения

JavaScript #21: замыкания, лексическое окружение, вложенные функции

JavaScript #22: свойства name, length и методы call, apply, bind функций

JavaScript #23: создание функций (new Function), функции setTimeout, setInterval и clearInterval

Перебор элементов

Одним из самых старых способов перебора элементов массива является цикл for по цифровым индексам:

Но для массивов возможен и другой вариант цикла, :

Цикл не предоставляет доступа к номеру текущего элемента, только к его значению, но в большинстве случаев этого достаточно. А также это короче.

Технически, так как массив является объектом, можно использовать и вариант :

Но на самом деле это – плохая идея. Существуют скрытые недостатки этого способа:

  1. Цикл выполняет перебор всех свойств объекта, а не только цифровых.

    В браузере и других программных средах также существуют так называемые «псевдомассивы» – объекты, которые выглядят, как массив. То есть, у них есть свойство и индексы, но они также могут иметь дополнительные нечисловые свойства и методы, которые нам обычно не нужны. Тем не менее, цикл выведет и их. Поэтому, если нам приходится иметь дело с объектами, похожими на массив, такие «лишние» свойства могут стать проблемой.

  2. Цикл оптимизирован под произвольные объекты, не массивы, и поэтому в 10-100 раз медленнее. Увеличение скорости выполнения может иметь значение только при возникновении узких мест. Но мы всё же должны представлять разницу.

В общем, не следует использовать цикл для массивов.

8) getElementsByClass()

Изначально не написана никем конкретно. Многие разработчики писали свои собственные версии и ничья не показала себя лучше остальных.

Следующая функция использует встроенный метод , если он есть, и ищет элементы самостоятельно в тех браузерах, где этого метода нет.

if(document.getElementsByClassName) {

	getElementsByClass = function(classList, node) {    
		return (node || document).getElementsByClassName(classList)
	}

} else {

	getElementsByClass = function(classList, node) {			
		var node = node || document,
		list = node.getElementsByTagName('*'), 
		length = list.length,  
		classArray = classList.split(/\s+/), 
		classes = classArray.length, 
		result = [], i,j
		for(i = 0; i < length; i++) {
			for(j = 0; j < classes; j++)  {
				if(list.className.search('\\b' + classArray + '\\b') != -1) {
					result.push(list)
					break
				}
			}
		}
	
		return result
	}
}
classList
Список классов, разделенный пробелами, элементы с которыми нужно искать.
node
Контекст поиска, внутри какого узла искать

Например:

var div = document.getElementById("mydiv")
elements = getElementsByClass('class1 class2', div)

JavaScript

JS Array concat() constructor copyWithin() entries() every() fill() filter() find() findIndex() forEach() from() includes() indexOf() isArray() join() keys() length lastIndexOf() map() pop() prototype push() reduce() reduceRight() reverse() shift() slice() some() sort() splice() toString() unshift() valueOf()

JS Boolean constructor prototype toString() valueOf()

JS Classes constructor() extends static super

JS Date constructor getDate() getDay() getFullYear() getHours() getMilliseconds() getMinutes() getMonth() getSeconds() getTime() getTimezoneOffset() getUTCDate() getUTCDay() getUTCFullYear() getUTCHours() getUTCMilliseconds() getUTCMinutes() getUTCMonth() getUTCSeconds() now() parse() prototype setDate() setFullYear() setHours() setMilliseconds() setMinutes() setMonth() setSeconds() setTime() setUTCDate() setUTCFullYear() setUTCHours() setUTCMilliseconds() setUTCMinutes() setUTCMonth() setUTCSeconds() toDateString() toISOString() toJSON() toLocaleDateString() toLocaleTimeString() toLocaleString() toString() toTimeString() toUTCString() UTC() valueOf()

JS Error name message

JS Global decodeURI() decodeURIComponent() encodeURI() encodeURIComponent() escape() eval() Infinity isFinite() isNaN() NaN Number() parseFloat() parseInt() String() undefined unescape()

JS JSON parse() stringify()

JS Math abs() acos() acosh() asin() asinh() atan() atan2() atanh() cbrt() ceil() cos() cosh() E exp() floor() LN2 LN10 log() LOG2E LOG10E max() min() PI pow() random() round() sin() sqrt() SQRT1_2 SQRT2 tan() tanh() trunc()

JS Number constructor isFinite() isInteger() isNaN() isSafeInteger() MAX_VALUE MIN_VALUE NEGATIVE_INFINITY NaN POSITIVE_INFINITY prototype toExponential() toFixed() toLocaleString() toPrecision() toString() valueOf()

JS OperatorsJS RegExp constructor compile() exec() g global i ignoreCase lastIndex m multiline n+ n* n? n{X} n{X,Y} n{X,} n$ ^n ?=n ?!n source test() toString() (x|y) . \w \W \d \D \s \S \b \B \0 \n \f \r \t \v \xxx \xdd \uxxxx

JS Statements break class continue debugger do…while for for…in for…of function if…else return switch throw try…catch var while

JS String charAt() charCodeAt() concat() constructor endsWith() fromCharCode() includes() indexOf() lastIndexOf() length localeCompare() match() prototype repeat() replace() search() slice() split() startsWith() substr() substring() toLocaleLowerCase() toLocaleUpperCase() toLowerCase() toString() toUpperCase() trim() valueOf()


С этим читают