Книга: JavaScript. Подробное руководство, 6-е издание

Image

Image

тег <img> в HTML-документе (Node, Element)

Объекты Image встраиваются в HTML-документ в виде тегов <img>. Изображения, присутствующие в документе, собираются в виде массива document.images[].

Свойство src объекта Image представляет наибольший интерес. Когда вы устанавливаете это свойство, броузер загружает и показывает изображение, заданное новым значением. Это позволяет создавать такие эффекты, как смена изображений и анимация. Соответствующие примеры приводятся в разделе 21.1.

Имеется возможность создавать невидимые объекты Image, добавляя новые элементы <img> вызовом метода document.сreateElement() или конструктора Image(). Обратите внимание: этот конструктор не имеет аргумента, который определял бы изображение для загрузки; чтобы загрузить изображение, достаточно просто установить свойство src созданного вами объекта Image. Чтобы фактически отобразить изображение, объект Image необходимо вставить в документ.

Конструктор

new Image([unsigned long width, unsigned long height])

Как и любой другой HTML-элемент, новый объект Image можно создать с помощью метода document.createElement(). Однако по историческим причинам клиентский JavaScript также определяет конструктор Image(), позволяющий сделать то же самое. Если указаны аргументы width и/или height, их значения будут присвоены атрибутам width и height тега <img>.

Свойства

Помимо свойств, перечисленных ниже, элементы Image также предоставляют свойства, соответствующие HTML-атрибутам alt, usemap, ismap.

readonly boolean complete

Значение true, если свойство src не было определено или изображение было загружено полностью, в противном случае - false.

unsigned long height

Высота области на экране в CSS-пикселах, в которой отображается данное изображение. Изменение значения этого свойства приводит к изменению высоты изображения на экране.

readonly unsigned long naturalHeight

Высота самого изображения.

readonly unsigned long naturalWidth

Ширина самого изображения.

string src

URL-адрес изображения. Присваивание значения этому свойству вынуждает броузер загрузить указанное изображение. Если объект Image был вставлен в документ, он отобразит новое изображение.

unsigned long width

Ширина области на экране в CSS-пикселах, в которой отображается данное изображение. Изменение значения этого свойства приводит к изменению ширины изображения на экране.

Оглавление книги