Разделы презентаций
- Разное
- Английский язык
- Астрономия
- Алгебра
- Биология
- География
- Геометрия
- Детские презентации
- Информатика
- История
- Литература
- Математика
- Медицина
- Менеджмент
- Музыка
- МХК
- Немецкий язык
- ОБЖ
- Обществознание
- Окружающий мир
- Педагогика
- Русский язык
- Технология
- Физика
- Философия
- Химия
- Шаблоны, картинки для презентаций
- Экология
- Экономика
- Юриспруденция
Введение в HTML. Диалоги средствами HTML и JavaScript 11 класс
Содержание
- 1. Введение в HTML. Диалоги средствами HTML и JavaScript 11 класс
- 2. 1
- 3. 2
- 4. 3Проект «Сумма двух чисел»
- 5. ВВеди А= Поясняющий текст4Создаем поле ввода Значение
- 6. ВВеди А= Создаем кнопкуНадпись на кнопкеСвязываем с кнопкой событиеИмя функции вызываемой при щелчке мышкой по кнопке5
- 7. ВВеди А= Результат=Создадим поле ввода для вывода в него результатов вычислений6
- 8. function f() { var a,b,s;
- 9. 8СкриптСоздание интерфейса
- 10. 9Проект «Калькулятор с выпадающим списком»
- 11. Выбери действие: Сложить Вычесть Разделить Умножить10Тег SELECT
- 12. function f() { var a,b,k,s;
- 13. 12СкриптСоздание интерфейса
- 14. 13Проект «Калькулятор с выбором действия»
- 15. Сложить Вычесть Умножить Разделить Данные
- 16. function f() { var a,b,s;
- 17. 16СкриптСоздание интерфейса
- 18. 17Проект «Калькулятор с выбором действия 2»
- 19. СложитьВычестьУмножитьРазделить18Переключатели используют, когда необходимо выбрать один единственный
- 20. function f() { var a,b,s;
- 21. 20СкриптСоздание интерфейса
- 22. 21Проект «Калькулятор с кнопками»
- 23. Слайд 23
- 24. Ячейка
- 25. 24Добавляем кнопку «Выход»
- 26. win = window.open(url, name, params) window.open("http://ya.ru"); -при
- 27. function f5(){var thisWindow = window.open("",'_self');var exit =
- 28. 27Проект «Меню с кнопками»
- 29. function f1(){var newWin = window.open("primer1.html", "Site1","width=420,height=230, resizable=yes,scrollbars=yes, status=yes")newWin.focus()}28Открываемая страницаЕе имяСвойстваПереводим фокус на новое окно
- 30. 29Список используемой литературы и интернет ресурсов:http://javascript.ru/ -
- 31. Скачать презентанцию
1 Кликни меняСоздаем событие выполняемое при загрузке страницыСвязываем с этим событием дествие
Слайды и текст этой презентации
Слайд 1Диалоги средствами HTML и JavaScript
Презентация к уроку информатики
11 класс
Автор: Юдин
Андрей Борисович
Слайд 21
Кликни меня
Создаем событие выполняемое при загрузке страницы
Связываем с этим событием дествие
Слайд 32
Кликни меня
Создаем событие выполняемое при щелчке мышкой
Связываем с этим событием действие
Указываем объект по которому надо щелкать мышкой
Слайд 5
ВВеди А=
Поясняющий текст
4
Создаем поле ввода
Значение отображаемое в поле ввода при загрузке страницы
Размер (длина) текстового
поля в символахИдентификатор поля ввода
Слайд 6
ВВеди А=
>
Создаем кнопку
Надпись на кнопке
Связываем с кнопкой событие
Имя функции вызываемой при
щелчке мышкой по кнопке5
Слайд 8
function f()
{
var a,b,s;
a=parseFloat(document.getElementById("input1").value);
b=parseFloat(document.getElementById("input2").value);
s=a+b;
document.getElementById("output1").value = s;
}
7
Объявляем
переменныеПреобразуем строку в число
Значение, записанное в первом окне ввода
document.getElementById - метод объекта document. Он возвращает ссылку на узел документа, которую можно использовать для изменения свойств и обращения к методам узла.
Находим сумму
Значение суммы помещаем в третье окно вывода
Слайд 11Выбери действие:
Сложить
Вычесть
Разделить
Умножить
10
Тег SELECT служит для создания
списка выбора (раскрывающегося списка), а также списка с одним или множественным выбором.Идентификатор раскрывающегося списка
Значение каждой строки списка
Слайд 12
function f()
{
var a,b,k,s;
a=parseFloat(document.getElementById("input1").value);
b=parseFloat(document.getElementById("input2").value);
k=parseFloat(document.getElementById("menu").value);
if (k==1) s=a+b;
if
(k==2) s=a-b; if (k==3) s=a/b;
if (k==4) s=a*b;
document.getElementById("output1").value = s;
}
11
Определяем какую строку списка выбрал пользователь
В зависимости от номера строки выполняем действие
Слайд 15 Сложить
Вычесть
type="checkbox" id="checkbox3"/> Умножить
Разделить
Данные элементы используются
для выбора одного или нескольких значений, отметив их флажками (галочками).Создаем checkbox
Идентификатор checkbox
Надпись checkbox
Следующий checkbox с новой строки
14
Слайд 16
function f()
{
var a,b,s;
a=parseFloat(document.getElementById("input1").value);
b=parseFloat(document.getElementById("input2").value);
if (document.getElementById('checkbox1').checked) s=a+b;
if (document.getElementById('checkbox2').checked) s=a-b;
if (document.getElementById('checkbox3').checked) s=a*b;if (document.getElementById('checkbox4').checked) s=a/b
document.getElementById("output1").value = s;
}
Если в checkbox поставлена галочка
15
Слайд 19Сложить
Вычесть
type="radio" name="rad1" id="r3" value="3">Умножить
Разделить
18
Переключатели используют, когда
необходимо выбрать один единственный вариант из предложенных. Имя поля (параметр name) для всех элементов группы должно быть одинаковым. Создаем переключатель
Имя для всех одно
Идентификатор переключателя
Установить точку при создании
Надпись за переключателем
Слайд 20
function f()
{
var a,b,s;
a=parseFloat(document.getElementById("input1").value);
b=parseFloat(document.getElementById("input2").value);
var rad1 = document.all.rad1;
if (rad1[0].checked) s=a+b;
if (rad1[1].checked) s=a-b;if (rad1[2].checked) s=a*b;
if (rad1[3].checked) s=a/b;
document.getElementById("output1").value = s;
}
19
Коллекция all представляет все элементы Web-страницы без исключений, в том числе и изображения. К элементам этой коллекции можно обращаться по номеру (нумеруются они в порядке появления в HTML-коде) или по имени.
Создаем массив переключателей
Проверяем какой переключатель включен
Слайд 26win = window.open(url, name, params)
window.open("http://ya.ru"); -при запуске откроется новое
окно с указанным URL
.
25
Полный синтаксис:
url - адрес для загрузки
в новое окноname - имя нового окна
params - cтрока с конфигурацией для нового окна. Состоит из параметров, перечисленных через запятую. Пробелов в ней быть не должно
Метод window.open() возвращает ссылку на вновь открытое окно, т.е. объект класса Window. Его можно присвоить переменной, с тем чтобы потом можно было управлять открытым окном (писать в него, читать из него, передавать и убирать фокус, закрывать).
Слайд 27function f5()
{
var thisWindow = window.open("",'_self');
var exit = confirm("Хотите закрыть страницу?");
if(exit){
thisWindow.close();
}
26
Выводит
сообщение в окне с двумя кнопками: "ОК" и "ОТМЕНА". Возвращает true/false в
зависимости от того, куда нажмет пользователь.Получаем доступ к свойствам текущего окна
Закрываем текущее окно
Слайд 29function f1()
{
var newWin =
window.open("primer1.html",
"Site1","width=420,height=230,
resizable=yes,scrollbars=yes,
status=yes")
newWin.focus()
}
28
Открываемая страница
Ее
имя
Свойства
Переводим фокус на новое окно
Слайд 3029
Список используемой литературы и интернет ресурсов:
http://javascript.ru/ - сайт посвященный языку
Javascript
https://learn.javascript.ru/ - современный учебник по Javascript
http://myrusakov.ru/ создание и раскрутка
сайта от А до ЯАлгоритмизация и основы объектно-ориентированного программирования на JavaScript (Информатика и ИКТ профильный уровень). Мартынов Н.Н. ООО «Бином-Пресс», 2010.
Похожие презентации
Обратная связь
Если не удалось найти и скачать доклад-презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:
Email: Нажмите что бы посмотреть
Что такое TheSlide.ru?
Это сайт презентации, докладов, проектов в PowerPoint. Здесь удобно хранить и делиться своими презентациями с другими пользователями.