- Теория
- Теория
Функция для создания элементов
Обратите внимание, по мере выполнения задачи, мы всё чаще повторяем одни и те же операции: создаём элементы с помощью document.createElement()
, добавляем им классы через элемент.classList.add()
, а в некоторых случаях и текстовое содержимое с помощью элемент.textContent
. Пора вынести повторяющийся код в функцию, чтобы не писать каждый раз много похожих строчек кода.
Объявим функцию, которая будет принимать на вход три строки: имя тега (tagName
), имя класса (className
) и текстовое содержимое (text
) элемента. Внутри неё будем создавать элемент с классом и текстом, а затем возвращать его наружу.
Не у всех элементов есть текстовое содержимое, поэтому дадим возможность вызывать функцию не с тремя, а с двумя параметрами. JavaScript сам по себе это позволяет. Но нам нужно предусмотреть проверку на присутствие третьего параметра. Будем добавлять в элемент текст с помощью textContent
только если параметр text
существует.
Как проверить наличие параметра? Если параметр не был передан в функцию, его значение внутри функции будет равно undefined
, то есть не определено. Значение undefined
приводится к логическому значению false
, поэтому достаточно такой простейшей проверки:
var createCard = function (required, optional) { if (optional) { // действия с optional } } // Функция отработает, но действия с optional выполняться не будут createCard('Обязательный аргумент'); // Функция отработает и действия с optional выполнятся createCard('Обязательный аргумент', 'Необязательный аргумент');
А что будет если аргумент передан? Во-первых, он не будет равен undefined
. Во-вторых, внутри оператора «круглые скобки» программа получит значение этого параметра и приведёт его к логическому типу. Как вы знаете из части «Условия», строки могут сами выступать в роли условий. Пустая строка приводится в false
, а непустая к true
. То есть, элементу добавится текстовое содержимое только тогда, когда мы передадим последним аргументом непустую строку. То, что надо.
Хорошо владеете JavaScript, но до сих пор не освоили Node.js? Записывайтесь на профессиональный курс «Node.js. Профессиональная разработка REST API». Цена 12 000 ₽.
- index.html
Вы перешли на другую страницу
Кликните внутри мини-браузера, чтобы поставить фокус в это окно.