We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

Конструктор Image() створює новий примірник HTMLImageElement. Наслідком є те саме, що й для document.createElement('img').

Синтаксис

new Image(width, height)

Параметри

width Optional
Ширина зображення (визначає значення атрибута width).
height Optional
Висота зображення (визначає значення атрибута height).

Приклади

У наведеному прикладі створюється елемент <img> завбільшки 100x200, до нього завантажується якесь зображення та додається до тіла документа:

var image = new Image(100, 200);
image.onload = function() {
  // Додати у DOM
  document.body.appendChild(image);
};
image.src = '/assets/зразок.png';

Того ж можна досягти оголошенням такого HTML-елемента просто всередині <body>:

<img width="100" height="200" src="/assets/зразок.png">

Але перевагою створення <img> за допомогою конструктора Image() є можливість додати зображення у DOM лише після його завантаження (завдяки обробникові події load).

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

Специфікація Статус Коментар
HTML Living Standard
The definition of 'Image()' in that specification.
Living Standard  

Підтримка веб-переглядачами

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Yes) (Yes) (Yes) (Yes) (Yes)
Feature Android Android Webview Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile Chrome for Android
Basic support (Yes) (Yes) (Yes) (Yes) (Yes) (Yes) (Yes)

 

Мітки документа й учасники

Зробили внесок у цю сторінку: asmforce
Востаннє оновлена: asmforce,