Día #8 Creando contenido editable en HTML5.

contenido editable en html5HTML5 abre una vía nueva para poder interactuar con los usuarios que visiten el sitio web. Se trata de el nuevo elemento contentEditable, que nos da la posibilidad de crear partes en un documento HTML5 que sea completamente editable.

Esta propiedad (contentEditable) sólo permite editar ya sean los textos que tengan este atributo asignado dentro de un elemento del documento HTML5, veamos como funciona:

 

Bueno en el código anterior tenemos un documento HTML5, en el body tengo una etiqueta h2 y luego tengo una sección con un id editable para darle algún estilo y a esa section le asocio la el atributo contenteditable con la propiedad true, es decir todo lo que hay en esta sección con será editable, el h3, el parrafo y la lista desordenada las voy a poder editar y agregar texto del lado del cliente o navegador. El h2 que está afuera de la sección, será imposible editar.

Ahora, este elemento cuneta con varias propiedades, las principales son:

true: Especifica que el elemento se puede modificar
false: Especifica que el elemento no se puede editar

de esta propiedades depende que nuestro contenido sea o no sea editable.

Podemos sacarle mucho provecho a estos elementos si lo juntamos con javascript, php para dar mayor interactividad y hacer cosas realmente buenas adecuándonos a lo que realmente es la web 2.0.

Nota: Los principales Navegadores soportan esta esta propiedad, incluso el poco deseado internet explorer de su version 5.5, ya que fue Microft quien fue el precursor de esta novedad.

Ver mas acerca de este atributo: http://www.w3schools.com/html5/att_global_contenteditable.asp

About the author

Johan Ricardo Niebles. Administrador y creador de este blog, Front-end (HTML + CSS + JS).con mas de 4 años de experiencia en el magico mundo web. Johan Ricardo