Html function if then

JavaScript if. else

The if statement specifies a block of code to be executed if a condition is true:

The else statement specifies a block of code to be executed if the condition is false:

if (condition) // block of code to be executed if the condition is true
> else <
// block of code to be executed if the condition is false
>

The else if statement specifies a new condition if the first condition is false:

if (condition1) // block of code to be executed if condition1 is true
> else if (condition2) // block of code to be executed if the condition1 is false and condition2 is true
> else // block of code to be executed if the condition1 is false and condition2 is false
>

Parameter Values

More Examples

If time is less than 10:00, create a «Good morning» greeting, if not, but time is less than 20:00, create a «Good day» greeting, otherwise a «Good evening»:

var time = new Date().getHours();
if (time < 10) greeting = "Good morning";
> else if (time < 20) greeting = "Good day";
> else greeting = «Good evening»;
>

If the first element in the document has an id of «myDIV», change its font-size:

var x = document.getElementsByTagName(«DIV»)[0];

if (x.id === «myDIV») <
x.style.fontSize = «30px»;
>

Change the value of the source attribute (src) of an element, if the user clicks on the image:

Display a message based on user input:

var letter = document.getElementById(«myInput»).value;
var text;

// If the letter is «c»
if (letter === «c») text = «Spot on! Good job!»;

// If the letter is «b» or «d»
> else if (letter === «b» || letter === «d») text = «Close, but not close enough.»;

// If the letter is anything else
> else text = «Waaay off..»;
>

// Get the value of the input field with >x = document.getElementById(«numb»).value;

// If x is Not a Number or less than 1 or greater than 10, output «input is not valid»
// If x is a number between 1 and 10, output «Input OK»

if (isNaN(x) || x < 1 || x >10) text = «Input not valid»;
> else text = «Input OK»;
>

Related Pages

Browser Support

if. else is an ECMAScript1 (ES1) feature.

ES1 (JavaScript 1997) is fully supported in all browsers:

Chrome	Edge	Firefox	Safari	Opera	IE
Yes	Yes	Yes	Yes	Yes	Yes

Источник

Условное ветвление: if, ‘?’

Иногда нам нужно выполнить различные действия в зависимости от условий.

Для этого мы можем использовать инструкцию if и условный оператор ? , который также называют оператором «вопросительный знак».

Инструкция «if»

Инструкция if(. ) вычисляет условие в скобках и, если результат true , то выполняет блок кода.

let year = prompt('В каком году была опубликована спецификация ECMAScript-2015?', ''); if (year == 2015) alert( 'Вы правы!' );

В примере выше, условие – это простая проверка на равенство ( year == 2015 ), но оно может быть и гораздо более сложным.

Если мы хотим выполнить более одной инструкции, то нужно заключить блок кода в фигурные скобки:

Мы рекомендуем использовать фигурные скобки <> всегда, когда вы используете инструкцию if , даже если выполняется только одна команда. Это улучшает читаемость кода.

Преобразование к логическому типу

Инструкция if (…) вычисляет выражение в скобках и преобразует результат к логическому типу.

Давайте вспомним правила преобразования типов из главы Преобразование типов:

• Число 0 , пустая строка «» , null , undefined и NaN становятся false . Из-за этого их называют «ложными» («falsy») значениями.
• Остальные значения становятся true , поэтому их называют «правдивыми» («truthy»).

Таким образом, код при таком условии никогда не выполнится:

…а при таком – выполнится всегда:

Мы также можем передать заранее вычисленное в переменной логическое значение в if , например так:

let condition = (year == 2015); // преобразуется к true или false if (condition)

Блок «else»

Инструкция if может содержать необязательный блок «else» («иначе»). Он выполняется, когда условие ложно.

let year = prompt('В каком году была опубликована спецификация ECMAScript-2015?', ''); if (year == 2015) < alert( 'Да вы знаток!' ); >else < alert( 'А вот и неправильно!' ); // любое значение, кроме 2015 >

Несколько условий: «else if»

Иногда нужно проверить несколько вариантов условия. Для этого используется блок else if .

let year = prompt('В каком году была опубликована спецификация ECMAScript-2015?', ''); if (year < 2015) < alert( 'Это слишком рано. ' ); >else if (year > 2015) < alert( 'Это поздновато' ); >else

В приведённом выше коде JavaScript сначала проверит year < 2015 . Если это неверно, он переходит к следующему условию year >2015 . Если оно тоже ложно, тогда сработает последний alert .

Блоков else if может быть и больше. Присутствие блока else не является обязательным.

Условный оператор „?“

Иногда нам нужно определить переменную в зависимости от условия.

let accessAllowed; let age = prompt('Сколько вам лет?', ''); if (age > 18) < accessAllowed = true; >else < accessAllowed = false; >alert(accessAllowed);

Так называемый «условный» оператор «вопросительный знак» позволяет нам сделать это более коротким и простым способом.

Оператор представлен знаком вопроса ? . Его также называют «тернарный», так как этот оператор, единственный в своём роде, имеет три аргумента.

let result = условие ? значение1 : значение2;

Сначала вычисляется условие : если оно истинно, тогда возвращается значение1 , в противном случае – значение2 .

let accessAllowed = (age > 18) ? true : false;

Технически, мы можем опустить круглые скобки вокруг age > 18 . Оператор вопросительного знака имеет низкий приоритет, поэтому он выполняется после сравнения > .

Этот пример будет делать то же самое, что и предыдущий:

// оператор сравнения "age > 18" выполняется первым в любом случае // (нет необходимости заключать его в скобки) let accessAllowed = age > 18 ? true : false;

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

В примере выше вы можете избежать использования оператора вопросительного знака ? , т.к. сравнение само по себе уже возвращает true/false :

// то же самое let accessAllowed = age > 18;

Несколько операторов „?“

Последовательность операторов вопросительного знака ? позволяет вернуть значение, которое зависит от более чем одного условия.

let age = prompt('Возраст?', 18); let message = (age < 3) ? 'Здравствуй, малыш!' : (age < 18) ? 'Привет!' : (age < 100) ? 'Здравствуйте!' : 'Какой необычный возраст!'; alert( message );

Поначалу может быть сложно понять, что происходит. Но при ближайшем рассмотрении мы видим, что это обычная последовательная проверка:

Вот как это выглядит при использовании if..else :

if (age < 3) < message = 'Здравствуй, малыш!'; >else if (age < 18) < message = 'Привет!'; >else if (age < 100) < message = 'Здравствуйте!'; >else

Нетрадиционное использование „?“

Иногда оператор «вопросительный знак» ? используется в качестве замены if :

let company = prompt('Какая компания создала JavaScript?', ''); (company == 'Netscape') ? alert('Верно!') : alert('Неправильно.');

В зависимости от условия company == 'Netscape' , будет выполнена либо первая, либо вторая часть после ? .

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

Не рекомендуется использовать оператор вопросительного знака таким образом.

Несмотря на то, что такая запись короче, чем эквивалентная инструкция if , она хуже читается.

Вот, для сравнения, тот же код, использующий if :

let company = prompt('Какая компания создала JavaScript?', ''); if (company == 'Netscape') < alert('Верно!'); >else

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

Смысл оператора «вопросительный знак» ? – вернуть то или иное значение, в зависимости от условия. Пожалуйста, используйте его именно для этого. Когда вам нужно выполнить разные ветви кода – используйте if .

Задачи

if (строка с нулём)

Да, выведется.

Любая строка, кроме пустой (а строка "0" – не пустая), в логическом контексте становится true .

Можно запустить и проверить:

Название JavaScript

Используя конструкцию if..else , напишите код, который будет спрашивать: „Какое «официальное» название JavaScript?“

Если пользователь вводит «ECMAScript», то показать: «Верно!», в противном случае – отобразить: «Не знаете? ECMAScript!»

Источник

JavaScript if, else, and else if

Conditional statements are used to perform different actions based on different conditions.

Conditional Statements

Very often when you write code, you want to perform different actions for different decisions.

You can use conditional statements in your code to do this.

In JavaScript we have the following conditional statements:

• Use if to specify a block of code to be executed, if a specified condition is true
• Use else to specify a block of code to be executed, if the same condition is false
• Use else if to specify a new condition to test, if the first condition is false
• Use switch to specify many alternative blocks of code to be executed

The switch statement is described in the next chapter.

The if Statement

Use the if statement to specify a block of JavaScript code to be executed if a condition is true.

Syntax

Note that if is in lowercase letters. Uppercase letters (If or IF) will generate a JavaScript error.

Example

Make a "Good day" greeting if the hour is less than 18:00:

The result of greeting will be:

The else Statement

Use the else statement to specify a block of code to be executed if the condition is false.

if (condition) // block of code to be executed if the condition is true
> else <
// block of code to be executed if the condition is false
>

Example

If the hour is less than 18, create a "Good day" greeting, otherwise "Good evening":

The result of greeting will be:

The else if Statement

Use the else if statement to specify a new condition if the first condition is false.

Syntax

if (condition1) // block of code to be executed if condition1 is true
> else if (condition2) // block of code to be executed if the condition1 is false and condition2 is true
> else // block of code to be executed if the condition1 is false and condition2 is false
>

Example

If time is less than 10:00, create a "Good morning" greeting, if not, but time is less than 20:00, create a "Good day" greeting, otherwise a "Good evening":

if (time < 10) <
greeting = "Good morning";
> else if (time < 20) <
greeting = "Good day";
> else <
greeting = "Good evening";
>

The result of greeting will be:

More Examples

Random link
This example will write a link to either W3Schools or to the World Wildlife Foundation (WWF). By using a random number, there is a 50% chance for each of the links.

Источник