Веб-програмування та інтерактивні сторінки

Про матеріал
Каскадні стилів HTML будують логічну структуру документа, а потім визначати формат її відображення. Цей підхід змінив усю технологію проектування сторінок сайту. Тепер можна визначити спочатку типи сторінок, потім логічні структури сторінок для кожного типу і, нарешті, для кожного логічного елемента, його склад і зовнішній вигляд.
Перегляд файлу
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Ти дізнаєшся: Веб-програмування
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування та інтерактивні сторінки
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLПоняття об'єктної моделіКаскадні стилів HTML будують логічну структуру документа, а потім визначати формат її відображення. Цей підхід змінив усю технологію проектування сторінок сайту. Тепер можна визначити спочатку типи сторінок, потім логічні структури сторінок для кожного типу і, нарешті, для кожного логічного елемента, його склад і зовнішній вигляд. Об'єктна модель документа (Document Object Model, DOM) — це засіб для роботи зі структурою документа, а також з елементами сторінки в кодах HTML та у сценаріях. Такі сценарії розміщують у спеціальних тегах <SCRIPT> і </SCRIPT>
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLСценаріїЩоб веб-сторінка була інтерактивною, тобто могла взаємодіяти з користувачем, і динамічною, необхідно використовувати скрипти, або сценаріїСценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документ. Сценарії описують усі можливі дії над елементами HTML-документа під час взаємодії з користувачем: реакцію на натискання кнопки миші, зміну вмісту сторінки залежно від певних дій користувача тощо
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLСценаріїПрограмний код Java. Script можна помістити в документ HTML у три способи: Сценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документокремі скрипти розмістити в тілі документа, там, де в їхньому використанні є потребаскрипти (функції, оголошення об'єктів) розмістити у заголовній частині документа між тегами HEAD>...</HEAD>, а використовувати їх у тілі документазберегти скрипт у файлі (із розширенням .js), а в документі дати посилання на нього
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLМетод alert()Цей метод генерує діалогове вікно-попередження, що відображає текст, заданий як параметр методу. Єдина кнопка ОК, напис якої не можна змінити, призначена для того, щоб користувач міг підтвердити, що він прочитав попередження. Сценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документ
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLМетод prompt()Цей метод генерує діалогове вікно запиту. Дві кнопки, наявні в діалоговому вікні, — ОК і Cancel — дають змогу користувачу закрити діалогове вікно, повернувши у сценарій значення текстового поля (кнопкою ОК) або спеціальне значення null (кнопкою Cancel). Сценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документ. Confirm (повертає значення true (істина), якщо користувач клацає кнопку ОК, і false (хибність),
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLВеб-сторінка зі сценарієм. Сценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документ
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Домашнє завдання. Вивчити тему. Продовжіть розробку веб-сторінки «Моя маленька батьківщина» з перевіркою певної інформації Заповнити словничок Об'єктна модель документа (Document Object Model, DOM), сценарій (script, скрипт)
Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 1. Вікно з повідомленням Створити просту веб-сторінку зі сценарієм. Він виводитиме на екран вікно з повідомленням «Увага!!!». Для цього використати метод alert( ) .
Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 1. Тест для перевірки навичок додавання. Створіть веб-сторінку, яка дозволяє перевірити навчики додавання. Зверніть увагу, що дано лише частина коду, яка розміщена між тегами <SCRIPT>. Код можна копіювати. Доповніть тест та систему оцінювання, щоб задавалися 8 запитань. Перешли дороблену сторінку на адресу вчителя інформатики.<SCRIPT>var s, i = 0s=confirm (=5) alert ("чудово")else if (i>=3) alert ("добре")else alert ("погано")" title="Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 1. Тест для перевірки навичок додавання. Створіть веб-сторінку, яка дозволяє перевірити навчики додавання. Зверніть увагу, що дано лише частина коду, яка розміщена між тегами ">
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Працюємо за комп’ютером
Зміст слайдів
Номер слайду 1

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк

Номер слайду 2

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування

Номер слайду 3

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Ти дізнаєшся: Веб-програмування

Номер слайду 4

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування та інтерактивні сторінки

Номер слайду 5

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLПоняття об'єктної моделіКаскадні стилів HTML будують логічну структуру документа, а потім визначати формат її відображення. Цей підхід змінив усю технологію проектування сторінок сайту. Тепер можна визначити спочатку типи сторінок, потім логічні структури сторінок для кожного типу і, нарешті, для кожного логічного елемента, його склад і зовнішній вигляд. Об'єктна модель документа (Document Object Model, DOM) — це засіб для роботи зі структурою документа, а також з елементами сторінки в кодах HTML та у сценаріях. Такі сценарії розміщують у спеціальних тегах

Номер слайду 6

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLСценаріїЩоб веб-сторінка була інтерактивною, тобто могла взаємодіяти з користувачем, і динамічною, необхідно використовувати скрипти, або сценаріїСценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документ. Сценарії описують усі можливі дії над елементами HTML-документа під час взаємодії з користувачем: реакцію на натискання кнопки миші, зміну вмісту сторінки залежно від певних дій користувача тощо

Номер слайду 7

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLСценаріїПрограмний код Java. Script можна помістити в документ HTML у три способи: Сценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документокремі скрипти розмістити в тілі документа, там, де в їхньому використанні є потребаскрипти (функції, оголошення об'єктів) розмістити у заголовній частині документа між тегами HEAD>..., а використовувати їх у тілі документазберегти скрипт у файлі (із розширенням .js), а в документі дати посилання на нього

Номер слайду 8

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLМетод alert()Цей метод генерує діалогове вікно-попередження, що відображає текст, заданий як параметр методу. Єдина кнопка ОК, напис якої не можна змінити, призначена для того, щоб користувач міг підтвердити, що він прочитав попередження. Сценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документ

Номер слайду 9

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLМетод prompt()Цей метод генерує діалогове вікно запиту. Дві кнопки, наявні в діалоговому вікні, — ОК і Cancel — дають змогу користувачу закрити діалогове вікно, повернувши у сценарій значення текстового поля (кнопкою ОК) або спеціальне значення null (кнопкою Cancel). Сценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документ. Confirm (повертає значення true (істина), якщо користувач клацає кнопку ОК, і false (хибність),

Номер слайду 10

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування. Основи мови HTMLВеб-сторінка зі сценарієм. Сценарій (script, скрипт) — це програма, написана спеціальною мовою програмування і вбудована в HTML-документ

Номер слайду 11

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Домашнє завдання. Вивчити тему. Продовжіть розробку веб-сторінки «Моя маленька батьківщина» з перевіркою певної інформації Заповнити словничок Об'єктна модель документа (Document Object Model, DOM), сценарій (script, скрипт)

Номер слайду 12

Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 1. Вікно з повідомленням Створити просту веб-сторінку зі сценарієм. Він виводитиме на екран вікно з повідомленням «Увага!!!». Для цього використати метод alert( ) .

Номер слайду 13

Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 1. Тест для перевірки навичок додавання. Створіть веб-сторінку, яка дозволяє перевірити навчики додавання. Зверніть увагу, що дано лише частина коду, яка розміщена між тегами

Номер слайду 14

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Працюємо за комп’ютером

Перегляд файлу






Перегляд файлу
Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування та інтерактивні сторінки
Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 1. Вікно з повідомленням Створити просту веб-сторінку зі сценарієм. Він виводитиме на екран вікно з повідомленням «Увага!!!». Для цього використати метод alert( ) .
Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 2. Тест для перевірки навичок додавання. Створіть веб-сторінку, яка дозволяє перевірити навчики додавання. Зверніть увагу, що дано лише частина коду, яка розміщена між тегами <SCRIPT>. Код можна копіювати. Доповніть тест та систему оцінювання, щоб задавалися 8 запитань. Перешли дороблену сторінку на адресу вчителя інформатики.<SCRIPT>var s, i = 0s=confirm (=5) alert ("чудово")else if (i>=3) alert ("добре")else alert ("погано")" title="Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 2. Тест для перевірки навичок додавання. Створіть веб-сторінку, яка дозволяє перевірити навчики додавання. Зверніть увагу, що дано лише частина коду, яка розміщена між тегами ">
Зміст слайдів
Номер слайду 1

Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Веб-програмування та інтерактивні сторінки

Номер слайду 2

Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 1. Вікно з повідомленням Створити просту веб-сторінку зі сценарієм. Він виводитиме на екран вікно з повідомленням «Увага!!!». Для цього використати метод alert( ) .

Номер слайду 3

Робота з комп'ютером. Чашук О. Ф., вчитель інформатики ЗОШ№23, Луцьк. Завдання 2. Тест для перевірки навичок додавання. Створіть веб-сторінку, яка дозволяє перевірити навчики додавання. Зверніть увагу, що дано лише частина коду, яка розміщена між тегами

Перегляд файлу

Завдання 1. Вікно з повідомленням

Створити просту веб-сторінку зі сценарієм. Він виводитиме на екран вікно з повідомленням «Увага!!!». Для цього використати метод alert( ) .

 

 

 

Завдання 2. Тест для перевірки навичок додавання

Створіть веб-сторінку, яка дозволяє перевірити навчики додавання. Зверніть увагу, що дано лише частина коду, яка розміщена між тегами <SCRIPT>. Код можна копіювати.

Доповніть тест та систему оцінювання, щоб задавалися 8 запитань. Перешли дороблену сторінку на адресу вчителя інформатики.

 

<SCRIPT>

var s, i = 0

s=confirm ("2+2=4 ? " ) ;

if (s==true) { alert("Правильно!"); i++} else alert('Hi!')

s=confirm ("2+3=6 ? " ) ;

if (s == false) { alert( "Правильно" ) ; i++} else alert("Hi!")

s=confirm ("2+4 = 6 ? " ) ;

if (s==true) {alert ("Правильно!"); i++} else alert("Hi!")

s=prompt ("2+2= ?", " " ) ;

if (s==4) {alert ("Правильно!"); i++} else alert("Hi!")

s=prompt ("2+3= ?"," " ) ;

if (s==5) {alert ("Правильно!"); i++} else alert("Hi!")

s=prompt ("2+4= ?"," " ) ;

if (s==6) {alert ("Правильно!"); i++} else alert("Hi!")

if (i>=5) alert ("чудово")

else if (i>=3) alert ("добре")

else alert ("погано")

</SCRIPT>

 

Перегляд файлу

Завдання 1. Вікно з повідомленням

Створити просту веб-сторінку зі сценарієм. Він виводитиме на екран вікно з повідомленням «Увага!!!». Для цього використати метод alert( ) . 

 

Завдання 2. Тест для перевірки навичок додавання

Створіть веб-сторінку, яка дозволяє перевірити навчики додавання. Зверніть увагу, що дано лише частина коду, яка розміщена між тегами <SCRIPT>. Код можна копіювати.

Доповніть тест та систему оцінювання, щоб задавалися 8 запитань. Перешли дороблену сторінку на адресу вчителя інформатики.

 

<SCRIPT>

var s, i = 0

s=confirm ("2+2=4 ? " ) ;

if (s==true) { alert("Правильно!"); i++} else alert('Hi!')  s=confirm ("2+3=6 ? " ) ;

if (s == false) { alert( "Правильно" ) ; i++} else alert("Hi!") s=confirm ("2+4 = 6 ? " ) ;

if (s==true) {alert ("Правильно!"); i++} else alert("Hi!") s=prompt ("2+2= ?", " " ) ;

if (s==4) {alert ("Правильно!"); i++} else alert("Hi!") s=prompt ("2+3= ?"," " ) ;

if (s==5) {alert ("Правильно!"); i++} else alert("Hi!")

s=prompt ("2+4= ?"," " ) ;

if (s==6) {alert ("Правильно!"); i++} else alert("Hi!") if (i>=5) alert ("чудово") else if (i>=3) alert ("добре") else alert ("погано")

</SCRIPT>

 

Середня оцінка розробки
Структурованість
5.0
Оригінальність викладу
5.0
Відповідність темі
5.0
Загальна:
5.0
Всього відгуків: 2
Оцінки та відгуки
  1. Єльцова Тетяна Олександрівна
    Дуже дякую! Стала в пригоді Ваша гарна розробка.
    Загальна:
    5.0
    Структурованість
    5.0
    Оригінальність викладу
    5.0
    Відповідність темі
    5.0
  2. Юревич Валентина Миколаївна
    Дякую за гарний матеріал. Успіхів в роботі :)
    Загальна:
    5.0
    Структурованість
    5.0
    Оригінальність викладу
    5.0
    Відповідність темі
    5.0
zip
Додано
6 травня 2019
Переглядів
11791
Оцінка розробки
5.0 (2 відгука)
Безкоштовний сертифікат
про публікацію авторської розробки
Щоб отримати, додайте розробку

Додати розробку