|
Наименование
|
Пример использования или синтаксис
|
Примечание
|
|
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
|
|
Арифметические операторы
|
|
+
|
|
плюс
|
|
-
|
|
минус
|
| * |
|
умножить
|
|
**
|
|
степень
|
|
/
|
|
делить
|
|
%
|
(* -при делении на 2 можно использовать для нахождения чет, нечет) |
модуль
|
|
++
|
(инкремент) |
прибавить в виде приращения
|
| -- |
(декремент) |
убавить в виде сокращения
|
|
Элементы активности
|
|
<button onclick="myF()">Кнопка</button>
|
<button onclick="myF()">Кнопка</button>
|
Можем ссылаться как на выполнение функции myF(), так и на вывод информации сразу
|
|
onclick
|
см. выше пример для кнопки
|
При кликании будет активироваться, можно добавлять к картинкам, кнопкам, ссылкам (пример)
|
|
onmouseover
|
см. выше пример для кнопки
|
активируется при наведении на элемент курсора мышки
|
| onmouseout |
см. выше пример для кнопки
|
активируется при уводе мышки с элемента |
| onkeydown |
см. выше пример для кнопки |
активируется при нажатии клавиш на клавиатуре |
| onload |
window.onload=function(…){…} |
активизируется при загрузке страницы |
| onkeyup |
onkeyup="function(this.value)"
|
активизируется в момент отпускания нажатой клавиши |
|
getElementById
|
document.getElementById("email") (берет значение из ID email)
|
document - Обращение к файлу html
getElementById() – получить элемент по идентификатору() (можно и при помощи других критериев)
email - id элемента
|
|
getElementsByClassName
|
getElementsByClassName("...")[0]; |
Берет элементы по классу (пример) |
|
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++. (пример)
|
