Java Script

 Как это бы не звучало странно, но интересоваться Java Script я стал исключительно ради собственного любопытства. Причем это любопытство было подкреплено, прежде всего, не изучением непосредственно языков программирования, а изучением электроники. В ней после построения неких аналоговых схем, я добрался до микроконтроллеров. И эти самые микроконтроллеры пришлось программировать, ведь без прошивки это не более чем кусочки пластика и железа. В итоге, чуть-чуть освоившись с программированием микроконтроллеров и начав кое-что осознавать, я ненароком провел некую параллель между попавшимся мне на глаза кодом для микроконтроллеров и Java Script. И тут-то и выяснилось, что изучая один из языков программирования, по сути ты познаешь логику построения и других языков.
 При этом долгое время я так и не мог решиться завести на сайте отдельную категорию под Java Script, так как не чувствовал в себе некой достаточной фундаментальности, для однозначно полезных и "сильных" статей по этой теме. Однако материал постепенно накапливался как снежный ком и хранить его размазывая по другим смежным категориям оказалось делом неблагодарным, так как там он был не в тему... В итоге так и родилась вот эта категория, которая станет для меня моим небольшим справочником в изучении Java Script, если же это кому-то пригодится еще, то будет и вовсе здорово. Осталось лишь замолвить слово о снисхождении к моему опыту, так как он изначально идет от дилетанта...

Далее, пожалуй, текст будет всегда несколько неряшлев и постоянно в доработке, ведь в нем то и дело будут появляться новые элементы, ссылки на конкретные примеры, объяснений операторов JS, по крайней мере так, как я их понимаю. К тому же масло в огонь будут подливать и разработчики ПО, ведь и у них что-то постоянно будет меняться, что потребует корректировок, что-то я буду переосмысливать и переписывать.
 ...это более для собственного пользования, однако если вы новичок или любитель в Java, то даже такая кустарная информация вам может быть очень даже полезной.

Операторы функции и их применения будут сведены в таблицу с комментариями и пояснениями, к ней и обращаемся.

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

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

Примечание

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 

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

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

onmouseout

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

активируется при уводе мышки с элемента
onkeydown см. выше пример для кнопки активируется при нажатии клавиш на клавиатуре
onload window.onload=function(…){…} активизируется при загрузке страницы

getElementById

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

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

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: - если ни одно из условий не сработало.

 

 

 

 Все что касалось изменения контента на сайте до этой статьи происходило по факту методом "бегства к лучшему" или "вытаскиванием кролика из шляпы", то есть страница просто менялась на другую, мы переходили на новую страничку вот и все... с помощью оператора document.location.href
 Или визуализацией в виде вывода текста из скрытых источников, то есть подменяли стиль на видимый (style.display = "none" заменить на style.display = "block"), также с помощью оператора задержки по времени setInterval , да мало ли еще что? Тут главное, что текст уже был на странице!
 Так вот, работа с AJAX дает новые возможности, в виде организации дополнительного запроса к серверу, потом проверки есть ли тот самый контент, что мы ищем. Если да, то получение информации от сервера и вывод контента на страницу. При этом страница остается та же, а контент расширяется за счет динамического блока, который и выводит контент на эту же страницу.

 Не часто, но бывает, что мы сталкиваемся с такими жизненными ситуациями, когда простые и общепринятые фразы будут сразу восприниматься шаблонно и ожидаемо! Это большой плюс в том плане, когда мы хотим донести именно тот самый шаблон, если он соответствует действительности. Например, если мы скажем, что огурец зеленый и все, не подразумевая под этим более глубоких причин возникновения его "зелёности". Однако если эти самые причины потребуют объяснения их происхождения для обывателя, то придется уже изворачиваться и предметно рассказывать о дыхании растений, об образовании хлорофилла и о чем-то таком в этом роде...

 Уже вполне привычная, но не очень приятная практика на сайтах, когда что-нибудь вылазить во время просмотра, через какое-то время. Прямо скажу, мне это не очень нравится, но это лишь частный пример, а на самом деле все то, о чем будет рассказано в этой статье можно использовать не только для таких ситуаций, но и просто для последовательного вывода информации через какое-то определенное время.
 Ну и в самом таком неординарном применении, можно даже выводить какой-то отсчет времени, если для переменной задать период обновления и ориентироваться на него. В общем давайте-ка к материалу статьи, там сейчас сами все поймете и увидите.

 В очередной раз всем привет, всем тем, кто интересуется темой написания скриптов на Java Script. Здесь я умышленно не заикнулся о программировании, так как заметки мои все же любительские и я их описываю так, как могу, умею и понимаю. Так вот, в этот раз я решил попробовать, как же можно трансформировать, менять, конвертировать, если даже хотите проводить метаморфозы со стилями на страницы с помощью JS. В принципе опыт получился вполне удачным и осязаемым, им я и хочу поделиться и оставить кое-что и себе на память. Вдруг когда взгляну для того чтобы использовать что-то в своих микропроектах.

 В одной из статей я уже как-то рассказывал о возможности скрыть текст. Опция весьма полезная, если скажем у нас есть значительный объем текста в виде справочной информации. Кто-то захочет его прочитать, кто-то не будет. Однако возможность его вывести есть и есть возможность не читать его. Все это здорово интерактивно и все в таком духе.
 На самом деле я не зря здесь провел подобную аналогию, так как в этой статье будет нечто похожее, но реализовано по-другому. Если первоначально описанный мною вариант заключался в подмене стилей, с чем Ява скрипт справляется на ура, то в этом случае будет происходит содержимого HTML прямо на странице.  В итоге, можно получить тот же самый результат, если скажем какую-то фразу, знак,символ, слово, просто подменить на целый абзац или наоборот.

 Весьма удобная, но не совсем простая в обработке данных форма ввода input типа radio. Форма смотрится лаконично, просто и ее хочется применять для работы с какими-либо условиями. Но обработка результатов получается несколько сложнее чем скажем просто с формой input, без указания какого-либо типа, то есть в нашем случае radio.
 Итак, давайте к описанию и примеру с этой формой ввода, а там уж каждый для себя сделает соответствующие выводы.

 Изменение информации при каждой новой загрузке страницы сайта способно не только разнообразить его внешний вид, но и просто обеспечить доступ к большему объему информации. Заключения это вполне логичные, но требующие неких потуг со стороны веб дизайнера и веб мастера. Именно о том, как же реализовать подмену информации при каждом обновлении страницы я и расскажу вот в этой вот статье.
Надо начать с прописных истин. Подмену конечных условий на странице сайта можно реализовать как с помощью PHP кода, который я не буду разбирать, но такая возможность существует, о чем я повторюсь и с помощью Java Script. Сразу скажу, что в статье будет именно Ява скрипт и написан он мной как любителем, так что если будут замечания или предложения, то они будут восприниматься положительно, если их изложение будет по существу и в корректной форме. Итак, начну.

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

 Хотелось бы сделать статью заметку, которая быть может когда-то перерастет во что-то большее, но пока она лишь будет статейка о самых простых вычислительных операциях с помощью формы работающей на Java Script.
По факту это обычный калькулятор, где можно будет ввести цифровые значения и получить вычисления. Конечно, самой большой ценностью может стать подсчет довольно сложных, но типовых формул. То есть подставляем значения и получаем желаемый результат. Как-то так. Собственно многие из вас и сами будут в состоянии развить мысли в нужно направлении.

 Постепенно осваивая азы и переходя к большему набору оперируемых понятий, объектов в JS, я начал понимать, что возможности реализовать одно и то же может быть решена по-разному. Эта статья как раз и явилась итогом такого понимания, когда я ознакомился с оператором switch. По своему принципу его можно ассоциировать с блоком операторов if, разве что при соблюдении какого-то определенного условия он сразу будет улетать в конец блока. Это и плюс и минус, все зависит от того, какие задачи перед вами стоят.
 Не буду подробно рассказывать о этих плюсах и минусах, а лучше расскажу еще раз о функционале оператора и приведу пример его работы. А уж выводы вы сможете сделать и без меня.

 Название этой статьи может показаться для многих набором слов, особенно для тех, кто зашел сюда и вовсе случайно, однако по-простому, по-другому и в то же время всеобъемлюще про то, что я решил написать, не сказать. Ну и ладно, ближе к теме.
Итак, в статье я рассмотрю пару вариантов того, как из простой формы на странице получить значение для Java Script, затем обработать его по определенному условию, и после выдать конечный логический результат.