Свойства объекта Math
|
Название |
Описание |
|
Abs |
Модуль |
|
Sin |
Тригонометрические функции |
|
Cos |
|
|
Tan |
|
|
Asin |
Обратные тригонометрические функции |
|
Acos |
|
|
Atan |
|
|
Exp |
Экспонента |
|
Log |
Логарифм |
|
Round |
Округление |
|
Floor |
Целое число, которое меньше или равно аргументу |
|
Pow |
Степень |
|
Sqrt |
Корень квадратный |
|
Min |
Меньшее из двух аргументов |
|
Max |
Большее из двух аргументов |
Рассмотрим пример: необходимо возвести в степень 2 меньшее из двух чисел (рис. 9.5):
<script >
x = Math.pow(Math.min(16, 5),2);
document.write("Результат выражения Math.pow(Math.min(16, 5),2): " + x);
</script>
Рис. 9.5. Результат выполнения скрипта
Использование объекта Date. JavaScript не имеет данных типа date. Однако, объект date и его методы позволяют работать с датами и временем в приложениях. Объект date имеет большое количество методов для установки, получения и управления датами. Он не имеет никаких свойств.
JavaScript обрабатывает date подобно тому, как происходит обработка в Java. Языки имеют одинаковые методы для объекта date, и оба языка сохраняют date как число миллисекунд начиная с 1 января, 1970 00:00:00.
Создание объект date:
varName = new Date(parameters)
Где varName - имя переменной JavaScript для создаваемого объекта date; это может быть новый объект или свойства существующего объекта.
Рассмотрим параметры Date.
1. Пустое значение: создает сегоднешнюю дату и время. Например, (рис. 9.6):
<script >
var todayDate = new Date();
document.write("Сегодня " + todayDate);
</script>
Рис. 9.6. Результат вывода текущей даты и времени
2. Строка, которая представляет дату в форме: "Month day, year hours:minutes:seconds". Например, Xmas = new Date("December 25, 2010 13:30:00"). Если опускается значение часов, минут или секунд, то будет установлено значение ноль.
3. Множество целых чисел для year, month и day. Например, Xmas = new Date(2010,11,25).
4. Множество значений для for year, month, day, hour, minute и seconds. Например, Xmas = new Date(2010,11,25,9,30,0).
Объект Date имеет большое количество методов для обработки дат и времени. Методы принадлежат к таким категориям:
"set" - методы для установки даты и времени в объектах Date;
"get" - методы для получения значений даты и времени из объектов Date;
"to" - методы для ряда, который возвращается из объектов Date.
Методы "get" и "set" разрешают получать и выполнять операции над секундами, минутами, часами, над днями месяца, днями недели, над месяцами и годами отдельно. Есть метод getDay, который возвращает день недели, но не соответствует методу setDay, так как день недели устанавливается автоматически. Эти методы используют целые числа, чтобы представить значение следующим образом:
секунды и минуты: от 0 до 59;
час: от 0 до 23;
день: от 0 до 6 (день недели);
дата: от 1 до 31 (день месяца);
месяц: от 0 (январь) до 11 (декабрь);
год: года начиная с 1900.
Например, пусть определена Date таким образом:
Xmas = new Date("December 25, 2010")
Xmas.getMonth() возвращает 11, и Xmas07.getYear() возвращает 2010.
Методы getTime и setTime полезны для сравнения дат. Метод getTime возвращает число миллисекунд, начиная с периода для объекта даты. Например, код показывает, сколько дней осталось до 8-го марта (рис. 9.7):
<script >
today = new Date();
nextMarch = new Date("March 8, 2010");
nextMarch.setYear(today.getYear());
msPerDay = 24 * 60 * 60 * 1000 ; // Количество миллисекунд в дне
daysLeft = (nextMarch.getTime() - today.getTime()) / msPerDay;
daysLeft = Math.round(daysLeft);
document.write("Текущая дата: " + today+ "<br>");
document.write("К следующего 8-го марта осталось: " + daysLeft+ " дня");
</script>
Рис 9.7. Результат работы программы
Этот пример создает объект date today, который содержит сегодняшнюю дату. Затем создается объект date nextMarch, устанавливающий год, текущего года. Затем, используя число миллисекунд в день, вычисляется число дней между today и nextMarch, используя getTime, и округляя до целого числа дней.
JavaScript имеет несколько функций "верхнего уровня", встроенных в язык. Это функции: eval, parseInt, parseFloat.
Функция eval. Аргумент встроенной функции eval - строка. Строка может быть - любая строка, представляющая выражение JavaScript утверждение, или последовательность утверждений. Выражение может включать переменные и свойства существующих объектов.
Эта функция полезна для оценки строки, представляющих арифметическое выражение.
Рассмотрим следующий пример (рис. 9.8):
<script >
var mystr="2001*3%5";
alert("Результат"+mystr+"="+eval(mystr));
</script>
Рис. 9.8. Результат работы программы
Функции parseInt и parseFloat. Эти две встроенные функции возвращают числовое значение, когда дана строка как аргумент.
Функция parseFloat анализирует его строковый аргумент, и возвращает число с плавающей точкой, если первый символ переданной строки - знак "плюс", знак "минус", десятичная точка число "е" (основание натурального логарифма) или цифра. Если parseFloat встречает недопустимый символ, то метод возвращает значение, основанное на подстроке, следующей до этого символа, игнорируя все последующие. Ее первый символ недопустим, parseFloat возвращает одно из двух значений, в зависимости от платформы:
0 на платформах Windows.
"NaN" на любой другой платформе, указывая, что значение - не номер.
Для арифметических целей, значение "NaN" - не число в любом основании системы исчисления. Можно вызывать функцию isNaN, чтобы определить, является ли результат parseFloat "NaN".
Функция parseInt анализирует ее первый строковый аргумент, и возвращает целое число, основанное на указанном основании системы исчисления. Например, при параметре radix, равном 10, string преобразовывается в десятичное число, при 8 преобразовывается в восьмеричное и при 16 - в шестнадцатеричное. Значения, большие 10, для оснований, превышающих 10, представляются символами от А до F вместо чисел. Использование radix, равного 2, служит для преобразований в двоичные числа. Числа с плавающей запятой будут преобразованы в целые числа. Правила обработки строки идентичны правилам для parseFloat.
Использование объектов window, document, location. Объект window обычно отвечает главному окну браузера и является объектом верхнего уровня в языке JavaScript, поскольку документы приоткрываются в окне. В документах, которые имеют фреймы, объект window может не всегда отвечать главному окну программы. Поэтому для обращения к конкретному окну нужно использовать свойство frames объекта parent. Фреймы - это те же окна. Чтобы обратиться к ним в языке JavaScript, можно использовать массив frames. Например, выражение parent.frames [0] обращается к первому фрейму окна браузера. Предполагается, что такое окно, существует, но с помощью метода window.open() можно открывать и другие окна и обращаться к ним с помощью свойств объекта window.
Для обращения к методам и свойствам объекта window используют такие варианты записи:
window.propertyName
window.methodName (parameters)
self.propertyName
self.methodName (parameters)
top.propertyName
top.methodName (parameters)
parent.propertyName
parent.methodName (parameters)
windowVar.propertyName
windowVar.methodName (parameters)
propertyName
methodName (parameters)
windowVar - экземпляр объекта window. Имя self - синоним, который используется для обращения к текущему окну в документе, который содержит фреймы, тогда как имя top применяется для обращения к главному окну браузера. Для этой цели можно применить и объект parent.
Объект window имеет свойства:
defaultStatus - текстовое сообщение, которое выводится в строке состояния (status bar) окна браузера;
frames - массив фреймов в документе, который содержит фрейм;
length - количество фреймов в документе, который содержит фрейм;
name - заголовок окна, которое задается с помощью аргумента windowName метода open();
parent - синоним, который используется для обращения к родительскому окну;
self - синоним, который используется для обращения к текущему окну;
status - текст временного сообщения в строке состояния окна браузера;
top - синоним, который используется для обращения к главному окну браузера;
window - синоним, который используется для обращения к текущему окну.
Метод alert() применяется для того, чтобы вывести на экран текстовое сообщение. Для открытия окна используется метод open(), а для закрытия - метод close(). С помощью метода confirm() происходит вывод на экран окна сообщения с кнопками Yes и No, и возвращает булевое значение true или false, в зависимости от нажатой кнопки. С помощью метода prompt() на экран выводится диалоговое окно с полем для ввода. Метод setTimeout() устанавливает в текущем окне обработку событий, связанных с таймером, а метод clearTimeout() отменяет обработку таких событий.
Объект window не обрабатывает события до тех пор, пока в окно не загружен документ. Однако можно обрабатывать события, связанные с загрузкой и разгрузкой документов. Обработчики таких событий задаются как значение атрибутов onLoad и onUnload, обусловленных в теге <body>. Эти же атрибуты могут быть определены в тегах <frameset> документов, которые содержат фреймы.
Пример: необходимо загрузить страницу http://my.site.ru в окно размером в 640х480 пикселей:
myWin = open ("http://my.site.ru", "myWin", "width=640, height=480");
Закрыть это окно можно из любого другого окна используя: myWin.close();
Объект document отвечает всему гипертекстовому документу, верней, его части, которая заключена в контейнер <body> ... </body>. Документы отображаются в окнах браузера, поэтому каждый из них связан с определенным окном. Все HTML-Объекты являются свойствами объекта document, поэтому они находятся в самом документе.
Объект document удобно использовать для динамического создания HTML-Документов.
Для обращения к свойствам и методам объекта document применяется следующий синтаксис:
document.propertyName
document.methodName (parameters)
Объект document имеет довольно много свойств, каждое из которых отвечает определенному HTML-Тегу в текущем документе:
alinkColor - отвечает атрибуту alink тега <body>;
anchors - массив, который отвечает всем меткам в документе;
bgColor - отвечает атрибуту bgColor (цвет тела) тега <body>;
cookie - фрагмент информации, записанный на локальный диск ("ключик");
fgColor - отвечает атрибуту fgColor (цвет текста) тега <body>;
forms - массив, который содержит все теги <form> в текущем документе;
images - массив изображений, ссылка на которые задана в текущем документе;
lastModified - дата последнего изменения текущего документа;
linkColor - отвечает атрибуту linkColor (цвет гиперсвязи по умолчанию);
links - массив, который содержит все гиперсвязи в текущем документе;
location - отвечает адресу URL текущего документа;
referrer - отвечает адресу URL документа, из которого пользователь перешел к текущему документу;
title - отвечает содержимому контейнера <title> . . . </title>;
vlinkColor - отвечает атрибуту vlinkColor (цвет <FONT COLOR="#800080"> гиперссылка, которая была нажата) тега <body>.
Метод clear() предназначен для очищения текущего документа. Лучше использовать для очищения методы open() и close(). Для записи информации в браузер применяют методы write() и writeln(). Поскольку эти методы записывают текст в браузер в HTML-Формате, можно создавать любой HTML-Документ динамически, включая готовые приложения JavaScript. Если в окно загружен документ, то запись данных сверх него может привести к сбою. Поэтому в окно следует записывать поток данных, для чего с помощью метода document.open() нужно открыть документ, а потом, вызвав необходимое количество раз метод document.wtite(), записать данные в документ. Чтобы послать данные в браузер, следует вызвать метод document.close().
В тегах <body> и <frame> можно использовать обработчики событий, для загрузки и разгрузки документа, onLoad и onUnload.
Для записи текста в HTML-Формате в браузер иногда применяют функцию document.writeln(). Например, можно динамично создавать теги изображений, выводя изображение на экран с помощью кода:
document.open();
document.writeln("<img sr='myimage.gif'>");
document.close();
С помощью JavaScript-Программ, в частности с помощью объекта document, можно создавать HTML-Документы и другие JavaScript-Программы. Например:
document.open();
document.writeln("<script language='JavaSript'>"+ "alert('Hello World!')"+ "</script>");
document.close();
Объект location сохраняет местоположение текущего документа в виде адреса URL этого документа. При управлении объектом location существует возможность изменять адрес URL документа. Объект location связан с текущим объектом window - окном, в которое загружен документ. Документы не содержат информации об адресах URL. Эти адреса являются свойством объектов window.
Синтаксис:
[windowVar.]location.prepertyName,
где windowVar - необязательная переменная, которая задает конкретное окно, к которому нужно обратиться. Эта переменная также разрешает обращаться к фреймам в документе, который содержит фрейм, с помощью свойства parent - синонима, который используется при обращении к объекту window верхнего уровня, если окон немного. Объект location является свойством объекта window.
Объект location имеет такие свойства:
hash - имя метки в адресе URL (если задано);
host - часть hostname:port адреса URL текущего документа;
hostname - имя хоста и домена (или цифровой IP-адрес) в адресе URL текущего документа;
href - полный адрес URL текущего документа;
pathname - часть адреса URL, который описывает каталог, в котором находится документ;
port - номер порта, который использует сервер;
protocol - префикс адреса URL, который описывает протокол обмена, (например, http:);
target - отвечает атрибуту target в теге <href>.
Для объекта location методы, не определенны, также не связанны с любыми обработчиками событий.
Примеры. Чтобы определить свойства location текущего окна как значение адреса URL, используется:
self.location="http://wdstudio.al.ru"
Чтобы загрузить ресурс в документ, который содержит фрейм нужно записать:
parent.frames[0].location = "http://my.site.ru";
где parent.frames[0] отвечает первому фрейму в текущем документе.
Технология AJAX
AJAX (от англ. Asynchronous JavaScript and XML — «асинхронный JavaScript и XML») — это подход к построению интерактивных пользовательских интерфейсов веб-приложений, заключающийся в «фоновом» обмене данными браузера с веб-сервером. В результате при обновлении данных веб-страница не перезагружается полностью, и веб-приложения могут быть сделаны более быстрыми и удобными.
AJAX - это не самостоятельная технология, а скорее концепция использования нескольких смежных технологий.
AJAX базируется на двух основных принципах:
1. Использование технологии динамического обращения к серверу, без перезагрузки всей страницы полностью, например:
с использованием XMLHttpRequest (основной метод);
через динамическое создание дочерних фреймов;
через динамическое создание тега <script>.
2 Использование DHTML для динамического изменения содержания страницы.
В качестве формата передачи данных обычно используется XML.
Впервый термин AJAX был публично использован 18 февраля 2005 в статье Джесси Джеймса Гарретта (Jesse James Garrett) «Новый подход к веб-приложениям». Гарретт придумал термин, когда ему пришлось как-то назвать новый набор технологий, предлагаемый им клиенту.
Однако в той или иной форме многие технологии были доступны и использовались гораздо раньше, например в подходе «Remote Scripting», предложенным компанией Microsoft в 1998, или с использованием HTML элемента IFRAME, появившегося в Internet Explorer 3 в 1996 году.
AJAX стал особенно популярен после использования его компанией Google в сервисах Gmail, Google Maps и Google Suggest.