To try it out for yourself, just enter this text into your location bar and hit enter:
You’ll remain on the same page, but you will be able to delete or alter any of the text. Of course, the catch is that only you can see your edits and only until you reload. What use is it, other than creating fake screenshots, as BlogStorm suggests?
The contentEditable property (and the similar document.designMode) are meant to enable WYSIWYG editing. There was a lengthy discussion on the WHATWG mailing list in 2005 that discussed problems with the property, questioning its necessity.
One of the cool parts about contentEditable is that it can apply to specific elements. The code above makes the entire body of the page editable. But imagine you wanted to have only some pieces of a page edit-in-place. It’s possible to set them to contentEditable=true to emulate some snazzy desktop-like features. Ajax could be used to save the content.
A little research shows few sites are utilizing this method now. That may have more to do with past browser support than anything else. We’ll have to see, but contentEditable may be a promising way to open up elements of the page to editing–and saving.