27.11.2009

JavaScript видеоурок #2

JavaScript воторой видеоурок

Приветствую вас, уважаемый читатель, сегодня я публикую новый видеоурок по JavaScript. Теперь, от вводного словоблудия, которое я все равно считаю необходимым, мы переходим к практике.

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

Поле ввода

Поставленная задача позволит:

  • Освоить метод связи getElementById.
  • Попрактиковаться в работе с переменными.
  • Получить понимание древовидной (объектно-ориентированной) парадигмы JavaScript. Для пущего понимания я решу еще одну задачу – изменение цвета рамки поля ввода при клике.
  • Поставленные задачи решаются двумя путями. Первый путь – это использование функции, что позволит нам изучить синтаксис процесса. Второй – применение директивы this, что, опять таки, позволит нам познакомиться с данной полезной штуковиной.

Видео с сервис YouTube (Часть 1):

Видео с сервиса YouTube (Часть 2):

Видео одной порцией на RuTube:

При желании вы можете скачать видеоурок в лучшем качестве с Deposit Files или с Яндекс.Диска (*.wmv, 38.7 МБайт).

HTML-файлы со скриптами, демонстрируемые в видео, можно скачать с Deposit Files (.zip, 2 КБайта)

Поговорим о постовых. Уважаемые администраторы тематически-близких ресурсов, я с радостью обменяюсь с вами постовыми. Связаться со мной можно через контакты.

В блоге “Записки программиста” опубликован интересный пост – Определение CMS средствами Perl. Рекомендовано к ознакомлению.

http://depositfiles.com/files/7bfgws9l2


  Post to Twitter



Если статья вам понравилась и вы не хотите пропустить свежие публикации, то подписывайтесь на RSS-ленту или получайте обновления сайта на эл. почту.

Метки:

categories JavaScript


Похожие материалы:


Отзывов: 24 на «JavaScript видеоурок #2»

  1. Автор: Максим, 27.11.2009 в 18:21

    Урок понравился!, жду продолжения….

    Ответить

  2. Автор: dizelbox, 27.11.2009 в 20:22

    Да, соглашусь, очень качественно сделан урок. Но я это уже прошел. Мне бы что-нибудь посложнее.

    Ответить

  3. Автор: VoRoN@, 27.11.2009 в 20:37

    Спасибо за блог.
    Скажите, а где лучше покупать рекламу для блога?

    Ответить

  4. Автор: Вася, 28.11.2009 в 13:24

    А когда будет продолжение?)
    ЗЫ. соглашусь надо чего нибудть послжожнее нежели функции и ооп

    Ответить

  5. Автор: Ян, 28.11.2009 в 18:12

    Очень похож язык на php, даже синтаксис во многом похож. Это хорошо :)

    Ответить

  6. Автор: Gomer, 29.11.2009 в 17:00

    Очень лаконично и доступно. Спасибо. Я рад, что нашел Ваш сайт.

    Ответить

  7. Автор: Вася, 29.11.2009 в 20:32

    плиз давайте еше )

    Ответить

  8. Автор: Dimox, 29.11.2009 в 20:48

    Имея знания фреймворка jQuery, понимать нативный JavaScript становится легче =) Спасибо!

    Такое пожелание – лучше бы как-то переоформить название сайта, которое в виде “водяного знака”, потому что под него попадает изображение и частично не видно, когда ты рисуешь в нижней части страницы.

    Ответить

  9. Автор: Саша Туманов, 30.11.2009 в 13:39

    файлик со скриптами с депозита похоже убрали…

    Ответить

  10. Автор: max, 01.12.2009 в 06:05

    А можно обработчик события onclick включить в js, чтобы не указывать его в html?

    Ответить

    • Автор: Андрей Морковин, 01.12.2009 в 12:47

      Можно, вот пример:

      document.getElementById(’myElement’).onclick = function() {
      alert(’Спасибо’)
      }

      #input id=”myElement” type=”button” value=”Нажми меня”/#

      или так:

      function doSomething() {
      alert(’Спасибо’)
      }

      document.getElementById(’button’).onclick = doSomething

      Но зачем это нужно? Мне кажется, не стоит усложнять.

      Если хотите пользоваться таким методом, то рекомендую ознакомится со статьей (там есть скользкие моменты, непонимание которых может привести к ошибкам):

      http://javascript.ru/tutorial/events/intro

      Ответить

      • Автор: max, 01.12.2009 в 20:42

        //Но зачем это нужно? Мне кажется, не стоит усложнять.//

        Спасибо, но я придерживаюсь мнения, что html все таки должен быть чистым , а в js относить все, что имеет к нему непосредственное отношение :)

        Ответить

  11. Автор: Василий, 14.12.2009 в 15:27

    Андрей отличные видеоуроки.Ваш блог для меня просто находка.Не бросайте это дело.Я думаю у вас будет всё отлично.

    Ответить

  12. Автор: Борис Петров, 09.03.2010 в 19:59

    Точно, жизнь не может быть идеальной :)

    Ответить

Ваш отзыв