HTMLImageElement

Baseline Widely available *

This feature is well established and works across many devices and browser versions. Its been available across browsers since julio de 2015.

* Some parts of this feature may have varying levels of support.

Learn more
See full compatibility

La interfaz HTMLImageElement provee de propiedas especiales y mtodos (ms all de las interfaces HTMLElement, tambin tiene disponible la herencia) para manipular el diseo y la presentacin de elementos <img>.

Propiedades

Heredadas de su padre, HTMLElement.

HTMLImageElement.align: Es un String que indica el alineamiento de la imagen respecto al contexto que la rodea.
HTMLImageElement.alt: Es un String que refleja el atributo HTML alt, indicando texto de respaldo a la imagen.
HTMLImageElement.border: Es un String 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 Read only: Devuelve un Boolean que es true si el navegador ha terminado de buscar la imagen, sea o no exitoso. Tambin devuelve true si la imagen no tiene valor src.
HTMLImageElement.crossOrigin: Es un String representa la configuracin CORS para el elemento imagen. Ver Atributos de configuracin CORS para ms detalles.
HTMLImageElement.currentSrc Read only: Devuelve un String
HTMLImageElement.height: Es un unsigned long que refleja el atributo HTML height, indica el alto de la imagen en pxeles CSS.
HTMLImageElement.hspace: Es un long que representa el espacio a izquierda y derecha de la imagen.
HTMLImageElement.isMap: Es un Boolean que refleja el atributo HTML ismap, indica que la imagen es parte del mapa de imagen del lado del servidor.
HTMLImageElement.longDesc: Es un String que representa la URI de una larga descripcin de la imagen.
HTMLImageElement.lowSrc: Es un String que referencia una copia de la imagen en mala calidad (pero ms rpida cargando)
HTMLImageElement.name: Es un String.
HTMLImageElement.naturalHeight Read only: Devuelve un unsigned long que representa el alto intrnseco de la imagen en pxeles CSS, si est disponible, de otro modo, es 0.
HTMLImageElement.naturalWidth Read only: Devuelve un unsigned long que representa el ancho intrnseco de la imagen en pxeles CSS, si est disponible, de otro modo, es 0.
HTMLImageElement.referrerPolicy: Es un String que refleja el atributo HTML referrerpolicy indica la referencia a usar para buscar la imagen.
HTMLImageElement.src: Es un String que refleja el atributo HTML src HTML attribute, contiene la URL completa de la imagen, incluido la base del URI
HTMLImageElement.sizes: Es un String
HTMLImageElement.srcset: Es un String que refleja el atributo HTML srcset, contiene una ista de imgenes 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 pxel.
HTMLImageElement.useMap: Es un String que refleja el atributo HTML usemap, contiene una URL parcial del mapa del elemento.
HTMLImageElement.vspace: Es un long que representa el espacio sobre y bajo la imagen.
HTMLImageElement.width: Es un unsigned long que refleja el atributo HTML width, indica el ancho de la imagen en pxeles CSS.
HTMLImageElement.x Read only: Devuelve un long que representa el hueco horizontal hasta la capa ms cercana. Esta propiedad copia el comportamiento de Netscape 4.
HTMLImageElement.y Read only: Devuelve un long que representa el hueco vertical hasta la capa ms cercana. Esta propiedad copia el comportamiento de Netscape 4.

Mtodos

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);