Edición Inline

Edición Inline

Editar los elementos de una página WEB. Utilizamos tres atributos:

• contenteditable: Hace elementos HTML individuales editables (true, false o inherit (convierte en elemento padre))
• designmode: Hace editable un documento completo HTML (on,off)
• spellcheck: Habilita corrección ortográfica (true, false)

Podemos formatear texto (negrita, itálica, subrayado, añadir un enlace, mostrar fuentes ...). Para formaterar texto utilizamos la función javascript genérica:

object.execCommand(sCommand[,bUserInterface][,value])

Hay que pasarle tres argumentos:

• sCommand (Obligatorio): string que especifíca el comando a ejecutar.
• bUserInterface (Opcional): true o false: Permite mostrar una interface de usuario
• vValue (Opcional): valor a asignar. Si no tiene valor se indica null

Por ejemplo: 

• document.execCommand('bold',false,null); -> negrita
• document.execCommand('italic',false,null); -> itálica
• document.execCommand('underline',false,null); -> subrayado

Para crear un enlace, llamamos a una función javascritp:

var url = prompt("Escribe URL:", "http://");if (url) document.execCommand("createlink",false,url);

Para visualizar el código guente de la página:

var content = document.getElementById("id").innerHTML;content.replace(/</g,'&lt;');content.replace(/>/g,'&gt;');alert(content);

Por defecto se incluye la corrección ortográfica.