Java Script

Наименование

Пример использования или синтаксис

Примечание

HTML  формы для ввода

<input   id="ida" >

<input   id="ida" >

Форма для ввода, рамка ida – свой уникальный id - a на страницу для элемента, для считывания переменной добавляем value 

<input type="radio" > 

<input type="radio" > 

 Примерно тоже самое, что и просто input, но обработка данных сложнее. (пример)

<input type="checkbox">

<input type="checkbox">

Примерно тоже самое, что и radio, только можно установить несколько значений.

onchange

<select onchange="...">

 Позволяет выбирать значение из списка (пример)

HTML  формы для вывода

<div>

<div id="demo1">Текст</div>

Используется для вывода данных, с возможностью подмены их через JS

<pre>

<pre id="demo1"></pre>

 Можно также как и в div выводить значение, но форма отображения блока будет уже со стилями свойственными pre

 Арифметические операторы

+ 

плюс 

-

минус 

умножить 

 **

степень 

/

делить

%

модуль

++

прибавить в виде приращения 

убавить в виде сокращения 

Элементы активности

<button onclick="myF()">Кнопка</button>

<button onclick="myF()">Кнопка</button>

Можем ссылаться как на выполнение функции myF(), так и на вывод информации сразу

onclick

см. выше пример для кнопки

При кликании будет активироваться, можно добавлять к картинкам, кнопкам, ссылкам (пример)

onmouseover 

см. выше пример для кнопки

активируется при наведении на элемент курсора мышки

см. выше пример для кнопки

onkeyup="function(this.value)"

getElementById

document.getElementById("email") (берет значение из ID email)

document - Обращение к файлу html
getElementById() – получить элемент по идентификатору() (можно и при помощи других критериев)
email - id элемента

getElementsByClassName

getElementsByTagName

getElementsByTagName("...")[0]

Берет элементы по названию блока div, p... (пример)

document.body.innerHTML.

document.body.innerHTML.replace(/8/g, '7'); (замена 8 на 7 подмена)

document.body.innerHTML.style (меняет стиль)

выводит значение, стиль в HTML

 document.location.href =

 document.location.href = (пример)

  перенаправляет со страницы что ввели или то, что взяли из формы (переменной)

setInterval

setInterval(function(){ ….},1000);

Вызывает функцию с заданной периодичностью многократно. (пример)

setTimeout

см. setInterval

Схожее с setInterval, но вызывает код один раз. (пример)

Сервисные (исполнительные) элементы

<script type="text/javascript">

</script>

Обрамляем JS

typeof x

document.getElementById("demo1").innerHTML = typeof x;

Х – переменная, для которой хотим узнать тип. Его выводим для нашего случая через запрос для блока ID demo1. Блок конечно тоже должен быть в наличии, а то куда же выводить то?!

let и var

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

let x = 5;

let x = document.getElementById("id");
var a = document.getElementById("x").value;

Присваиваем значение для переменной. Можно использовать присвоение через document.getElementById("id"). id - в данном случае берется скажем из формы ввода где форма расположена в document.

if

if (условие) {делаем}

Условие для одного раза

while

Смотри if

Тоже, что и if, только будет повторяться, пока не уйдет далее. Может зациклить машину.

switch

switch(i) {
  case i=0:
    ...
    break;
  case i=1:
    ...
    break;
  case i=2:
    ...
  default:
    ...
}

Выполняем одно из условии исходя из критерия, скажем для переменной i. Как только условие будет выполнено, то цикл перебора закончится. (пример)

default: - если ни одно из условий не сработало.

 for

 for (let i=0; i<10; i++) {что делаем}

 Применяется, как правило, для работы с массивами, перебирая от i = 0 до i<10 с шагом i++. (пример)