Turn any webpage into a WYSIWYG editor with HTML5

published on
There is a little known feature in the HTML5 spec that enables you to turn an entire page or a single element into a WYSIWYG editor with a single line of JavaScript and its supported by every major browser out there. To enable you simply set the contentEditable attribute of an element to true: // make the entire website editable document.body.contentEditable = true; // make an element editable document.getElementById('myDiv').contentEditable = true; To check if an element is editable you check the isContentEditable attribute: if (document.getElementById('myDiv').isContentEditable){ // yes its editable } Both contentEditable and isContentEditable are described in the HTML5 Editing spec.