<HTML>
<HEAD>
<TITLE> Исследование свойств изображений </TITLE>
<script>
<!--
function chpict1()
{ var w=document.forms[0].elements[0].value
var h=document.forms[0].elements[1].value
if (w!=0)
document.images[0].width=w
if (h!=0)
document.images[0].height=h
document.images[0].border=document.forms[0].elements[2].value
document.images[0].alt= document.forms[0].elements[3].value
}
//-—>
</script>
</HEAD>
<BODY bgcolor="F8F8FF">
<CENTER>
<НЗ>Встраиваемые иэображения</НЗ>
<IMG src=pl.gif>
<FORM>
Для изменения размеров изображения введите значения
одного или двух параметров и нажмите на кнопку <В>Просмотр</В><br>
ширина (width): <input type="text" size=8><br>
высота (height): <input type="text" size=8><br>
Для задания рамки введите число, определяющее толщину рамки
в пикселах, и нажмите на кнопку <В>Просмотр</В><br>
толщина рамки (border): <input type="text" size=8 value=0><br>
Альтернативный текст (alt): <input type="text" size=40><P>
<input type="button" value= "Просмотр" onclick="chpict1()">
<input type="reset" value="Отменить">
</FORM>
</CENTER>
</BODY>
</HTML>
Обратите внимание, что в этом варианте не заданы параметры name в HTML-тегах. В них нет необходимости, т. к. доступ к необходимым значениям осуществлялся на основе объектной модели JavaScript.
|
|
Перестановка изображений
Напишем сценарий, который реализует обмен рисунков в документе. Пусть в документе расположено четыре изображения, пронумерованных от 1 до 4 (рис. 3.4). В текстовых полях указываются номера рисунков, которые необходимо поменять местами. Требуется, чтобы после нажатия кнопки Поменять местами изображения переместились на нужные места.
Сначала проверим, правильно ли заданы номера изображений, если это не так, то выдадим сообщение. Переменная z служит для запоминания адреса первого графического изображения. Доступ к изображению с номером r1 производится с помощью конструкции document, images [r1-1]. Для того чтобы на место изображения с номером ri поместить изображение с номером г2, требуется выполнить оператор присваивания:
document.images[r1-1].src=document.images[r2-l].src
И, наконец, на место изображения с номером г2 помещается изображение, которое ранее было на месте с номером ri, и адрес которого запомнили в переменной z:
document.images[r2-l].src=z
Приведем полностью документ со сценарием (листинг 3.2).