Los objetos (elemento <object>
) son elementos HTML que ofrecen una solución general para incrustar todo tipo de recursos externos, como podría ser el caso de imágenes, vídeos, documentos PDF, documentos HTML u otro tipo de recursos que deban ser manejados por un complemento.
Nota de autor: es importante remarcar que si se quiere incrustar una imagen es recomendable usar el elemento <img>
. Para vídeo debe usarse el elemento <video>
, preferentemente. Lo mismo ocurre con los documentos HTML: en este caso se recomienda el uso de <iframe>
o <embed>
(HTML5).
Lista de elementos descritos en este artículo:
Elemento | Descripción |
---|---|
<object> | Para crear y definir un objeto |
<param> | Para añadir parámetros adicionales |
Creación de objetos: elemento <object>
El elemento <object>
es un elemento de línea, por lo que ocupa el mínimo espacio horizontal y permite que otros elementos de línea quepan a sus lados. Este elemento tiene dos etiquetas: <object>
(de apertura) y </object>
(de cierre). Su contenido permitido es otro elemento descrito en este artículo: <param>
.
El uso más habitual que se ha dado históricamente a este elemento es la incrustación de aplicaciones Adobe Flash, una tecnología obsoleta que ha sido sustituida con creces por HTML5. La mayoría de los navegadores actuales ya no dan soporte a esta tecnología. Sin embargo, podemos incrustar un documento PDF.
Ejemplo de código HTML con un documento PDF incrustado:
<object
type='application/pdf'
data='/resources/html/ejemplo.pdf'
width='350'
height='200'>
</object>
Para que se entienda mejor, los atributos se han distribuido en líneas nuevas.
Resultado:
Los atributos de <object>
Existen unos cuantos atributos básicos del elemento <object>
que son indispensables para su correcto funcionamiento. Es importante conocerlos para poder configurar el objeto de acuerdo a las necesidades que se presenten.
El atributo ‘data’
El atributo data
permite especificar la URL de la dirección del documento. Su valor deberá ser una ruta o dirección válida, y puede ser relativa o absoluta, según la conveniencia del desarrollador. En el ejemplo inicial, se ha indicado la ruta relativa que accede al documento PDF incrustado.
El atributo ‘type’
Con el atributo type
es posible indicar el tipo de contenido que se quiere incrustar. Hay muchos tipos de medio de contenido, como puede ser un documento PDF, un archivo comprimido (ZIP), un archivo de audio (MID), un archivo de datos separados por coma (CSV) o un archivo de vídeo MP4. Por ejemplo:
<object type='application/pdf'></object>
El atributo ‘name’
El atributo name
es el que permite asignar un nombre al contexto de navegación anidado que se define con el elemento <object>
. El valor será una cadena de texto que podrá usarse en otros elementos, como sería el caso de enlaces (elemento <a>
) y formularios (elemento <form>
).
El atributo ‘form’
El atributo form
permite introducir una cadena de texto que debe coincidir con el atributo id
del formulario del mismo documento HTML con el que este contenido incrustado debe estar asociado.
Los atributos ‘width’ y ‘height’
Mediante los atributos width
y height
es posible especificar, en píxeles, el ancho y alto de la caja contenedora del elemento incrustado. Su valor debe ser un número entero positivo, y no es necesario indicar las unidades.
El atributo ‘typemustmatch’
El atributo typemustmatch
apareció por primera vez en la versión HTML5, y se utiliza para indicar que el atributo type
y el contenido real incrustado deben coincidir. Al tratarse de un atributo binario, con su inclusión es suficiente para activar esta función, y su ausencia no lo activa (por defecto).
Añadir parámetros: elemento <param>
El elemento <param>
tiene la función de añadir parámetros para los recursos incrustados con el elemento <object>
. En este sentido, <param>
debe ir anidado entre las etiquetas <object>
y </object>
al que pertenece. Se trata de un elemento vacío, sin etiqueta de cierre, y no crea caja contenedora.
Los parámetros especificados por este elemento son pasados al complemento (o plugin) que se está incrustando. Esto significa que sólo son necesarios cuando el elemento incrustado es un complemento. Muchos complementos no son soportados por los navegadores, o requieren extensiones adicionales.
Los atributos de <param>
El elemento <param>
tiene dos atributos. Con el atributo name
se indica el nombre del parámetro, cuyo valor será una cadena de texto que ayudará al plugin a identificar el parámetro. Con el atributo value
se especifica el valor asociado al atributo name
. De este modo, el complemento usará el par «nombre-valor» para identificar y procesar el valor del parámetro.