Замечательная документация по языку Javascript и динамическому HTML находится
здесь
Динамический HTML - HTML-документ, способный динамически менять свое содержимое в зависимости от внешних событий, например настроек или запросов пользователя. Для придания web-странице динамичности используются маленькие програмки (скрипты). Различают скрипты на стороне сервера (php, perl и т.д.), которые находятся на сервере и передают html-страницу уже измененную в зависимости от запроса клиента и скрипты на стороне клиента (Javascript и VBScript), обработкой которых занимается браузер. Javascript, основанный на упрощенном языке Java, поддерживается всеми браузерами. VBScript, основанный на упрощенном языке VisualBasic, поддерживается только браузером Internet Explorer.
Javascript - язык для написания
маленьких программ, способных динамически
менять содержимое страницы. Обычно скрипт
располагается внутри страницы HTML (тег <script...)
или во внешнем файле, на который есть ссылка
со страницы HTML (<script src="...). Javascript -
скрипт на стороне клиента, т.е. скрипт
обрабатываемый браузером.
Каждый объект (тег) на странице может
иметь имя (параметр name). При
воздействии на объект браузер обрабатывает
заданные события. Например событие
onclick
вознивает при щелчке мышью по объекту,
onmouseover -
при наведении курсора мыши на
объект, а onmouseout, когда курсор
мыши покидает элемент.
Следующий тег описывает изображение,
которому присвоено имя picExam.
При щелчке мышью по изображению должна
вызывается функция
picClick. При
наведении на него курсора мыши должна
вызываться функция picOn. Функция,
которую мы назвали picOut
вызывается когда курсор мыши покидает
рисунок.
<img name="picExam" onclick="picClick()"
onmouseover="picOver()" onmouseout="picOut()"
src="images/nav_up2.gif"...>
Код скрипта (язык Javascript) с функциями-обработчиками событий:
<script type="text/javascript"><!--
function picClick()
{
alert('Нажали на рисунок');
}
function picOver()
{
document.picExam.src = 'images/nav_up2_h.gif';
}
function picOut()
{
document.picExam.src = 'images/nav_up2.gif';
}
//--></script>
А вот и сам этот рисунок.
Потеребите его мышью, пожалуйста.
Обратите внимание на задержку, которая возникает при первом наведении мыши на рисунок: браузеру требуется время, чтобы загрузить с сайта требуемый файл.
На этой и следующих стрницах применена подсветка навигационных изображений.
Код скрипта размещен в отдельном файле images.js.
Скрипт подключается тегом
<script type="text/javascript" src="images.js"></script>,
задаваемым в заголовке документа
<head>...</head>.
Текст скрипта оптимизирован для работы со многими объектами
<img. Имена изображений <img name=... и
имена файлов с рисунками почти совпадают.
