HTMLImageElement: Конструктор Image()

Базовая реализация Широко доступна

Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с июля 2015 года.

Конструктор Image() создаёт новый экземпляр HTMLImageElement. Он функционально эквивалентен document.createElement('img').

Примечание: Не следует путать эту функцию с функцией CSS image().

Синтаксис

new Image()
new Image(width)
new Image(width, height)

Параметры

width Необязательно: Ширина изображения (т.е. значение атрибута width).
height Необязательно: Высота изображения (т.е. значение атрибута height).

Примечание по использованию

Весь растровый образ загружается независимо от размеров, указанных в конструкторе. Размер, указанный в конструкторе, отражается в свойствах HTMLImageElement.width и HTMLImageElement.height созданного экземпляра. Внутренняя ширина и высота изображения в пикселях CSS отражаются в свойствах HTMLImageElement.naturalWidth и HTMLImageElement.naturalHeight. Если размеры не указаны в конструкторе, обе пары свойств имеют одинаковые значения.

Примеры

const myImage = new Image(100, 200);
myImage.src = "picture.jpg";
document.body.appendChild(myImage);

Это эквивалентно определению следующего тега HTML внутри <body>:

<img width="100" height="200" src="picture.jpg" />

Спецификации

Спецификация
HTML # dom-image-dev

Совместимость с браузерами

	Рабочие столы					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari на IOS	Samsung Internet	WebView Android
`Image`	1	12	1	8	1	18	4	10.1	1	1.0	4.4

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/Image