Цели, задачи и основы Java. Script sp. courses.

Скачать презентацию Цели, задачи и основы Java. Script sp. courses. Скачать презентацию Цели, задачи и основы Java. Script sp. courses.

08_js.pptx

  • Размер: 2.9 Мб
  • Автор: Анатолий Кигель
  • Количество слайдов: 26

Описание презентации Цели, задачи и основы Java. Script sp. courses. по слайдам

Цели, задачи и основы Java. Script sp. courses. dp. ua Цели, задачи и основы Java. Script sp. courses. dp. ua

HTML статичен После того как страница загрузиться в браузер она остаётся неизменной,  информацияHTML статичен После того как страница загрузиться в браузер она остаётся неизменной, информация на ней не изменяется. Чтобы получить другую информацию, нужно загрузить другую страницу. Однако пользователи (поработав с настольным программным обеспечением) привыкли к какой-никакой но интерактивности. Что неудивительно, ведь HTML (и CSS) не является языком программирования.

Java. Script (ECMAScript) Цель внедрения Java. Script в браузеры – повышение интерактивности. Всё чтоJava. Script (ECMAScript) Цель внедрения Java. Script в браузеры – повышение интерактивности. Всё что изменяется на странице без перезагрузки страницы это Java. Script *. * В CSS 3 появилась возможность создавать анимацию без применения JS.

Задачи Java. Script 1. Манипуляция элементами (тегами) HTML-страницы (когда страница уже в браузере посетителя);Задачи Java. Script 1. Манипуляция элементами (тегами) HTML-страницы (когда страница уже в браузере посетителя); А если конкретнее, то: изменять разметку документа. Ведь браузер «нарисует» только то что описано в разметке. 42. Делать что-то в ответ на действия пользователя (реагировать на действия пользователя).

Реагирование на действия пользователя 5 Что общего у этих вещей? Каждая из этих вещейРеагирование на действия пользователя 5 Что общего у этих вещей? Каждая из этих вещей делает что-то, только в ответ на действия пользователя. Можно сказать каждое действие пользователя это событие, и на него нужно как-то отреагировать.

 «Листалка» фотографий 6 Или делать по отдельной странице под каждую фотографию, или… http: «Листалка» фотографий 6 Или делать по отдельной странице под каждую фотографию, или… http: //files. courses. dp. ua/web/07/ex 01. html Задача Java. Script – изменять разметку страницы, ссылка на изображение в теге тоже относиться к разметке страницы.

 «Листалка» фотографий 7 Задача Java. Script  – изменять разметку страницы,  ссылка «Листалка» фотографий 7 Задача Java. Script – изменять разметку страницы, ссылка (атрибут src ) на изображение в теге тоже относиться к разметке страницы.

 «Листалка» фотографий ( автоматическая ) 8 Задача Java. Script  – изменять разметку «Листалка» фотографий ( автоматическая ) 8 Задача Java. Script – изменять разметку страницы, ссылка (атрибут src ) на изображение в теге тоже относиться к разметке страницы. Делать это можно не только в ответ на действия пользователей но и по таймеру.

Применение Java. Script 9 Разработка на Java. Script сводиться к тому, чтобы сказать браузеру:Применение Java. Script 9 Разработка на Java. Script сводиться к тому, чтобы сказать браузеру: «Когда пользователь нажмёт туда, сделай то» . Первая опора Java. Script – события, механизм который позволяет связывать блоки кода (которые имеют имя и называемыми функциями ), с каким либо происшествием. Вторая опора Java. Script – возможность вносит изменения в разметку документа, а именно: добавлять теги, удалять теги, перемещать местами тега, изменять стилевые свойства тега, его атрибуты и содержимое.

События на странице (Events) http: //www. w 3 schools. com/jsref/dom_obj_event. asp 10 События на странице (Events) http: //www. w 3 schools. com/jsref/dom_obj_event. asp

11 HTML-документ Древовидная структура HTML-документа 11 HTML-документ Древовидная структура HTML-документа

12 Добавление элементов на страницу Добавить новый элемент на страницу – сделать его дочерним12 Добавление элементов на страницу Добавить новый элемент на страницу – сделать его дочерним для какого-либо из существующих элементов.

13 Добавление элементов на страницу Добавить новый элемент на страницу – сделать его дочерним13 Добавление элементов на страницу Добавить новый элемент на страницу – сделать его дочерним для какого-либо из существующих элементов. “ Additional text. ”

14 Фотогалерея http: //files. courses. dp. ua/web/07/ex 02. html Используем ресурс https: //source. unsplash.14 Фотогалерея http: //files. courses. dp. ua/web/07/ex 02. html Используем ресурс https: //source. unsplash. com/random/ для наполнения фотографиями нашей страницы с галереей.

Немного практики:  «галерея» 15 Используем ресурс https: //source. unsplash. com/random/  для наполненияНемного практики: «галерея» 15 Используем ресурс https: //source. unsplash. com/random/ для наполнения фотографиями нашей страницы с галереей. Для плавности изменения размера мы можем задействовать свойство transition.

Немного практики:  «галерея» 16 Заглянем в «консоль разработчика» Наш скрипт динамически добавляет новыеНемного практики: «галерея» 16 Заглянем в «консоль разработчика» Наш скрипт динамически добавляет новые теги в документ без какой-либо перезагрузки страницы.

JS может подключить Bootstrap если это невозможно сделать через заголовок JS может подключить Bootstrap если это невозможно сделать через заголовок

Немного практики:  «Подключение Bootstrap в динамике» 18 http: //files. courses. dp. ua/web/bootstrap/ex 01.Немного практики: «Подключение Bootstrap в динамике» 18 http: //files. courses. dp. ua/web/bootstrap/ex 01. html Скачайте заготовку и поместите её в Notepad++

Немного практики:  «Подключение Bootstrap в динамике» 19 Приведенный код – создаст тег linkНемного практики: «Подключение Bootstrap в динамике» 19 Приведенный код – создаст тег с ссылкой на библиотеку bootstrap и добавит его в . Всё будет происходить по нажатию кнопки.

Java. Script – язык программирования Java. Script – язык программирования

Java. Script – язык программирования 1.  Компьютеры не понимают русский язык (пока), Java. Script – язык программирования 1. Компьютеры не понимают русский язык (пока), они понимают языки программирования; 212. Чтобы компьютер (и браузер как его часть) что-то сделал нужно ему сказать что нужно делать (описать последовательность действий) на языке программирования; 3. Как правило, задача любой программы заключается в манипулировании информацией (данными), например: текстом и картинками; 4. Java. Script тоже занимается манипуляцией данными (тегами и их содержимым). При помощи JS мы можем манипулировать HTML-документом: изменять теги, добавлять и удалять их.

Java. Script – язык программирования Java. Script предназначен,  чтобы уговорить компьютер что-то сделатьJava. Script – язык программирования Java. Script предназначен, чтобы уговорить компьютер что-то сделать на стороне пользователя (на вашем компьютере, в вашем браузере), в отличии от других языков которые работают на стороне сервера. + +

Тройка технологий - безальтернативна 23 Технологии front-end (технологии в браузере) Структурирует информацию.  КонтейнерТройка технологий — безальтернативна 23 Технологии front-end (технологии в браузере) Структурирует информацию. Контейнер для данных (теги). Оформление внешнего вида «контейнеров» с данными. Манипуляции с «контейнерами» , изменения стилевых свойств.

Основы программирования на базе Java. Script Основы программирования на базе Java. Script

25 Переменные / Типы / Операции Ветвления (условные операторы) Циклы / Массивы (структуры данных)25 Переменные / Типы / Операции Ветвления (условные операторы) Циклы / Массивы (структуры данных) Функции Объекты. Java. Script как язык программирования его концепции

Майкл Моррисон  «Изучаем Java. Script» 26 Майкл Моррисон «Изучаем Java. Script»