JavaScript. Учебник начального уровня (DarkGoodWIN) - страница 3

>

>

>

> Забавно писать на html + java script не зная ни того, ни другого.

>Но попробуем.

>

>

>

>

>



Запускаем в браузере и видим:

Основная часть кода осталась без изменений, после текста добавились две пустые строки для более гармоничного внешнего вида странички. Больше всего в этом примере нас интересует новая строчка

рассмотрим её внимательно.

Первое, что бросается в глаза — непривычно большой тэг input. Да, название тэга именно input, от остальных элементов оно отделено пробелом. Что это за элементы? Мы о них раньше не говорили…

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

<Поле ввода, типа кнопка, со значением «нажми меня», в случае клика должен выполниться скрипт «this.value = «Спасибо»;">

Ничего сложного. Поле ввода или элемент управления или просто контрол может быть разных типов, мы в нашем примере используем кнопку. Атрибут value в данном случае задает текст, который будет написан на нашей кнопке. Для того, чтобы «подчеркнуть», что заданное нами значение именно текст (строка), его следует заключить в кавычки или апострофы.

Почему я написал в данном случае задаёт текст, разве это работает не всегда? Дело в том, что для разных тэгов атрибут с одним и тем же именем может означать разные вещи. Для кнопок этот код работает, для чего–то другого — может работать, а может и не работать.

Вот, наконец, мы и подошли непосредственно к программированию, а строчка «this.value = «Спасибо»;" по сути наша первая программа. Разберём и её тоже.

Ключевое слово this в данном случае — это наша кнопка. Этим словом (в Delphi похожую функцию выполняет Self) кодируется объект, которому принадлежит вызываемая функция (в JS есть свои нюансы, но в первом приближении это верно). То есть в нашем случае мы написали, что в случае, если наша конкретная кнопка будет нажата будет выполнен некий код. Так вот, в этом коде this — это и будет наша кнопка.

Точка после  this означает, что далее мы будем обращаться к тому, что есть у this. В данном случае мы обращаемся к атрибуту value тэга. Да, да, к тому самому, значение которого чуть раньше мы задавали в тэге input. Теперь мы по сути делаем то же самое, только чуть иначе.