CSS3 HTML5

Los nuevos estándares para el diseño y desarrollo web y Móvil

Capacitación HTML5

El atributo hidden en HTML5

| 4 Comentarios

En HTML5 además de nuevos elementos, también se incorporan nuevos atributos.

El atributo global hidden se puede aplicar a un elemento para indicar que está oculto, que no se mostrará.

Operando de una manera similar al display:none de CSS, esta opción tiene un sentido semántico que además de no mostrar el elemento, significa que no está visible para el medio o dispositivo que lo esté leyendo.

Al ser un atributo del tipo booleano, simplemente lo pondremos o no lo pondremos. Un ejemplo de su uso sería:

<span hidden="hidden">Error oculto</span>

El contenido de la línea anterior no será mostrado en los navegadores compatibles con esta característica (Firefox, Chrome, Safari y Opera). Si quitamos hidden="hidden" ese elemento volverá a ser visible. La ventaja es que podremos manipularlo mediante el DOM mediante funciones de JavaScript.

 

¿Te ha resultado útil esta información? ¿Quieres saber más sobre HTML5? Escríbenos.

Autor: Damián

Escribió cuatro libros, relacionados con sistemas operativos, hardware y desarrollo web, entre ellos se destaca Webmaster Profesional (editado en el año 2009) y HTML 5 – Entienda el cambio, aproveche su potencial lanzado en el 2011 en formato papel y en el 2012 en versión ebook. Se ha desempeñado como editor de libros relacionados con informática. Ha realizado trabajos de edición en la revista Users Digital Design, para la cual participa también escribiendo notas sobre diseño y desarrollo web. Ha colaborado como autor en la revista Dr. Max, Phone Users y en diversas colecciones de fascículos (Universo PC y 1000 Ideas PC, entre otras). Escribe contenidos para diversos medios online, incluyendo el sitio RedUSERS.com. Es consultor y especialista en desarrollo web, con amplio conocimiento en HTML, CSS, AJAX, PHP y Bases de datos. En la actualidad se destaca su trabajo en la preparación de contenidos relacionados con CSS3 y HTML5. Es profesor y dicta curso de HTML5 y clases en la Carrera de Programador Web en el Instituto IT Master Professional Training, en Buenos Aires (Argentina).

4 Comentarios

  1. Creo que la sintaxis correcta es
    Error oculto
    y no
    Error oculto
    Tomo como referencia
    http://www.w3.org/html/wg/drafts/html/master/editing.html#the-hidden-attribute

    • Disculpa ha interpretado el html
      [ span hidden ] Error oculto [ / span ]
      en vez de
      [ span hidden = ” hidden ” ] Error oculto [ / span ]

      Sustituimos “” por “]”

        • Se puede utilizar como explico en el artículo o directamente colocando hidden.

          Probando en Chrome funciona. En algunos navegadores no es compatible.

          Según la especificación el atributo hidden se puede manejar desde JavaScript de la siguiente manera:

          document.getElementById('elemneto1').hidden = true;
          document.getElementById('elemneto2').hidden = false;

Deja un comentario

Es requirido que se compelte.*.