Шаг 10 - Массив изображений

Раз уж стали говорить о массивах в JavaScript, то об массиве изображений надо сказать обязательно. В этом массиве хранятся все изображения страницы. Доступ к любому изображению происходит стандартным для всех массивов способом, поэтому не будем на это отвлекаться.

У каждого элемента массива все названия свойств, как наверное уже должно быть ясно, аналогичны всем атрибутам тега <img>.

Примерчик простенького документа:

<html>
	<img src=images/1.gif width=10 height=13 border=2 alt="hehe"><br>
	<img src=prob.gif width=12% height=13% border=0 alt="Pic1">
</html>

С помощью следующего сценария можно посмотреть значения всех наиболее важных свойств изображений:

for (i=0;i<document.images.length;i++){
	document.writeln("<dt><b>",document.images[i].src,"</b>");
	document.writeln("<dd>Width: ",document.images[i].width);
	document.writeln("<dd>Height: ",document.images[i].height);
	document.writeln("<dd>Border: ",document.images[i].border);
	document.writeln("<dd>Alt: ",document.images[i].alt);
};

Вот, что вылезло у меня в результате выполнения данного кода:

file:///L:/my_site/html/js/images/1.gif 
	Width: 10 
	Height: 13 
	Border: 2 
	Alt: hehe 
file:///L:/my_site/html/js/prob.gif 
	Width: 241 
	Height: 61 
	Border: 0 
	Alt: Pic1 

Как Вы видите все свойства на лицо. Менять понятное дело все это Вы можете стандартными методами, т.е. просто присваивая какому-либо свойству новое значение:

document.images[1].width=123;
document.images[0].border++;

Это пока начальные понятия об изображениях, в будущем мы еще что-то найдем интересное.


Предыдущий Шаг | Следующий Шаг | Оглавление
Автор Кузин Андрей.