HTMLImageElement

La interfaz HTMLImageElement provee de propiedas especiales y métodos (más allá de las interfaces HTMLElement, también tiene disponible la herencia) para manipular el diseño y la presentación de elementos <img>.

Propiedades

Heredadas de su padre, HTMLElement.

HTMLImageElement.align (en-US) This is an obsolete API and is no longer guaranteed to work.
Es un DOMString que indica el alineamiento de la imagen respecto al contexto que la rodea.
HTMLImageElement.alt (en-US)
Es un DOMString que refleja el atributo HTML alt, indicando texto de respaldo a la imagen.
HTMLImageElement.border (en-US) This is an obsolete API and is no longer guaranteed to work.
Es un DOMString que indica el ancho del borde alrededor de la imagen. Este está desaprobado y debe usarse la propiedad CSS border en su lugar.
HTMLImageElement.complete (en-US) Read only
Devuelve un Boolean (en-US) que es true si el navegador ha terminado de buscar la imagen, sea o no exitoso. También devuelve true si la imagen no tiene valor src (en-US).
HTMLImageElement.crossOrigin (en-US)
Es un DOMString representa la configuración CORS para el elemento imagen. Ver Atributos de configuración CORS para más detalles.
HTMLImageElement.currentSrc (en-US) Read only This is an experimental API that should not be used in production code.
Devuelve un DOMString
HTMLImageElement.height (en-US)
Es un unsigned long que refleja el atributo HTML height, indica el alto de la imagen en píxeles CSS.
HTMLImageElement.hspace (en-US) This is an obsolete API and is no longer guaranteed to work.
Es un long que representa el espacio a izquierda y derecha de la imagen.
HTMLImageElement.isMap (en-US)
Es un Boolean (en-US) que refleja el atributo HTML ismap, indica que la imagen es parte del mapa de imagen del lado del servidor.
HTMLImageElement.longDesc (en-US) This is an obsolete API and is no longer guaranteed to work.
Es un DOMString que representa la URI de una larga descripción de la imagen.
HTMLImageElement.lowSrc (en-US) This is an obsolete API and is no longer guaranteed to work.
Es un DOMString que referencia una copia de la imagen en mala calidad (pero más rápida cargando)
HTMLImageElement.name (en-US) This is an obsolete API and is no longer guaranteed to work.
Es un DOMString.
HTMLImageElement.naturalHeight (en-US) Read only
Devuelve un unsigned long  que representa el alto intrínseco de la imagen en píxeles CSS, si está disponible, de otro modo, es 0.
HTMLImageElement.naturalWidth (en-US) Read only
Devuelve un unsigned long que representa el ancho intrínseco de la imagen en píxeles CSS, si está disponible, de otro modo, es 0.
HTMLImageElement.referrerPolicy (en-US) This is an experimental API that should not be used in production code.
Es un DOMString que refleja el atributo HTML referrerpolicy indica la referencia a usar para buscar la imagen.
HTMLImageElement.src (en-US)
Es un DOMString que refleja el atributo HTML src HTML attribute, contiene la URL completa de la imagen, incluido la base del URI
HTMLImageElement.sizes (en-US) This is an experimental API that should not be used in production code.
Es un DOMString
HTMLImageElement.srcset (en-US) This is an experimental API that should not be used in production code.
Es un DOMString que refleja el atributo HTML srcset, contiene una ista de imágenes candidatas, separadas por una coma (',', U+002C COMMA). Una imagen candidata es una URL seguida por 'w' con el ancho, o una 'x' seguida de la densidad del píxel.
HTMLImageElement.useMap (en-US)
Es un DOMString que refleja el atributo HTML usemap, contiene una URL parcial del mapa del elemento.
HTMLImageElement.vspace (en-US) This is an obsolete API and is no longer guaranteed to work.
Es un long que representa el espacio sobre y bajo la imagen.
HTMLImageElement.width (en-US)
Es un unsigned long que refleja el atributo HTML width, indica el ancho de la imagen en píxeles CSS.
HTMLImageElement.x (en-US) Read only This is an experimental API that should not be used in production code.
Devuelve un long que representa el hueco horizontal hasta la capa más cercana. Esta propiedad copia el comportamiento de Netscape 4.
HTMLImageElement.y (en-US) Read only This is an experimental API that should not be used in production code.
Devuelve un long que representa el hueco vertical hasta la capa más cercana. Esta propiedad copia el comportamiento de Netscape 4.

Métodos

Heredados de su padre, HTMLElement.

Image()
El constructor Image(), toma dos unsigned long opcionales, ancho y alto del recurso, crea una instacia de creates HTMLImageElement no insertada en el árbol DOM.

Ejemplo

var img1 = new Image(); // HTML5 Constructor
img1.src = 'image1.png';
img1.alt = 'alt';
document.body.appendChild(img1);

var img2 = document.createElement('img'); // Uso DOM HTMLImageElement
img2.src = 'image2.jpg';
img2.alt = 'alt text';
document.body.appendChild(img2);

// Usando la primera imagen en el documento
alert(document.images[0].src);

Especificiaciones

Especicifación Estado Comentario
Referrer Policy
La definición de 'referrer attribute' en esta especificación.		 Candidate Recommendation Añadida la propiedad referrerPolicy.
CSS Object Model (CSSOM) View Module
La definición de 'Extensions to HTMLImageElement' en esta especificación.		 Working Draft Añadidas propiedades x e y
HTML Living Standard
La definición de 'HTMLImageElement' en esta especificación.		 Living Standard Las siguientes propiedades han sido añadidas: srcset, currentSrc y sizes.
HTML5
La definición de 'HTMLImageElement' en esta especificación.		 Recommendation Un constructor (con 2 parámetros opcionales) añadido. Las siguientes propiedades quedaron obsoletas: name, border, align, hspace, vspace, y longdesc. Las siguientes propiedades son ahora unsigned long, en lugar de long: height, y width.Las siguientes propiedades fueron añadidas: crossorigin, naturalWidth, naturalHeight, y complete.
Document Object Model (DOM) Level 2 HTML Specification
La definición de 'HTMLImgElement' en esta especificación.		 Obsolete La propiedad lowSrc fue eliminada.
Las siguientes propiedades son ahora long, en lugar de DOMString: height, width, hspace, y vspace.
Document Object Model (DOM) Level 1 Specification
La definición de 'HTMLImgElement' en esta especificación.		 Obsolete Definición inicial.

Compatibilidad con navegador

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! (en-US)
Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Soporte básico (Yes) 1.0 (1.7 o anterior) (Yes) (Yes) (Yes)
lowSrc (Yes) (Yes) ? (Yes) (Yes)
naturalWidth, naturalHeight (Yes) (Yes) 9 (Yes) (Yes)
crossorigin (Yes) (Yes) ? (Yes) (Yes)
complete (Yes) (Yes) 5[4] (Yes) (Yes)
srcset This is an experimental API that should not be used in production code. 34 32 (32)[2] Sin soporte 21 7.1
currentSrc This is an experimental API that should not be used in production code. (Yes) 32 (32)[2] Sin soporte (Yes) Sin soporte
sizes This is an experimental API that should not be used in production code. (Yes) 33 (33)[3] Sin soporte (Yes) Sin soporte
x e y (Yes) 14[1] Sin soporte (Yes) (Yes)
referrerPolicy This is an experimental API that should not be used in production code. Sin soporte 42 (42) [5] Sin soporte Sin soporte Sin soporte
Característica Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Soporte básico (Yes) 1.0 (1.0) (Yes) (Yes) (Yes)
lowSrc ? ? ? ? ?
naturalWidth, naturalHeight ? ? 9 ? (Yes)
crossorigin ? (Yes) ? ? (Yes)
complete ? (Yes) ? ? (Yes)
srcset This is an experimental API that should not be used in production code. Sin soporte 32.0 (32)[2] Sin soporte Sin soporte iOS 8
currentSrc This is an experimental API that should not be used in production code. Sin soporte 32.0 (32)[2] Sin soporte Sin soporte Sin soporte
sizes This is an experimental API that should not be used in production code. Sin soporte 33.0 (33)[3] Sin soporte Sin soporte Sin soporte
x e y (Yes) 14[1] Sin soporte (Yes) (Yes)
referrerPolicy This is an experimental API that should not be used in production code. Sin soporte 42.0 (42) [5] Sin soporte Sin soporte Sin soporte

[1] Las propiedades x e y fueron eliminadas en Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4) pero reestablecidas en Gecko 14.0 (Firefox 14.0 / Thunderbird 14.0 / SeaMonkey 2.11) por razones de compatibilidad.

[2] Esta característica está detras de la preferencia dom.image.srcset.enabled, por defecto false.

[3] Esta característica está detras de la preferencia dom.image.picture.enabled, por defecto false.

[4] IE reporta false para imágenes rotas.

[5] Esta propiedad fue nombrada referrer desde Firefox 42 a 44.

Ver también

  • El elemento HTML implementa esta interfaz: <img>