En HTML5 además de nuevos elementos, también se incorporan nuevos atributos. Esto resulta fundamental para resolver muchas necesidades de los desarrolladores y maquetadores.
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.
Modo de uso de atributo hidden en HTML5
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.
Como podemos ver el atributo hidden en HTML5 es muy fácil de usar y nos permite indicar si un elemento aún no está para visualizar o no debe verse por alguna razón. Vale recordar que esta opción debe usarse de manera incorrecta con fines de SEO o para ocultar menús, por ejemplo.
Para saber más podemos leer el documento publicado por MDN: https://developer.mozilla.org/es/docs/Web/HTML/Global_attributes/hidden.
Más sobre Diseño y desarrollo Web
Autor de los libros: Webmaster Profesional, HTML5: Comprenda el cambio y Apps HTML5 para móviles. Soy especialista en Desarrollo Web. Realizo proyectos basados en Inteligencia Artificial. Colaboré como autor y editor de contenidos para revistas, colecciones y diversos medios impresos y digitales. Brindo capacitaciones, clases de formación y consultorías sobre lenguajes de programación y herramientas para Desarrollo Web y móvil en modalidad online y presencial.
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 «]»
…. no hay manera 🙁
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;
Hola buenas mi nombre es Santi y tengo una pregunta. ¿Es posible ver las respuestas de un test online que hacen en la universidad cuya respuesta(si le damos a inspeccionar elemento) a mi parecer esta ocultada por un hidden?. Utilizan Java Script y me gustaria saber si hay alguna manera de manipular el hidden para que te salga cual es la respuesta correcta
Hola Santiago. Respecto a tu pregunta, no tengo una respuesta precisa ya que no conozco el test que comentás. Desde el punto de vista programación, en general, lo recomendado es que las respuestas a cuestionarios o tests tengan el proceso del lado servidor. De ese modo se puede asegurar mejor que la respuesta no pueda ser visible hasta que le usuario indique la suya.
Saludos
Hola, cual seria el opuesto de hidden? me refiero q ya esta oculto y lo quiero ver
Lo contrario al atributo hidden es que no esté puesto como atributo en la etiqueta.
Si estás trabajando con JavaScript se puede eliminar con removeAttribute(«hidden»)
Saludos