Ab und zu ist es sinnvoll einen Screenshot vom Browserinhalt zu machen, um damit die Verwendung einer Webseite oder eines Formulars oder ähnlichem zu verdeutlichen. Wenn eine Änderung im Screenshot vorgenommen werden soll, greifen viele gleich zum Grafikprogramm Ihrer Wahl. Sofern hierbei nur ein wenig Text geändert werden soll ist dies aber wesentlich einfacher möglich.

Inhalte lassen sich mit dem CONTENTEDITABLE Attribut editierbar machen. Im HTML Quellcode würde das Attribut wie folgt eingesetzt:

<div CONTENTEDITABLE> Ich bin editierbarer Inhalt<div>

Und hier mal im Einsatz:

Schreib hier. Einfach mit der Maus "reinklicken" und losschreiben, löschen oder was auch immer.

Von einigen älteren Browsern wird dieses Attribut nicht unterstützt. Möchte man das gesamte Dokument bearbeiten, so ist dies unproblematisch, denn es existiert darüber hinaus eine Eigenschaft namens designMode. Mit designMode lässt sich zum einen prüfen ob ein Dokument editierbar ist, zum anderen lässt sich dieser Modus damit ein- und ausschalten.

Als Javascript ergibt sich zum einschalten:

javascript: document.body.contentEditable = 'true'; document.designMode = 'on'; void 0

Void verhindert die Ausgabe von "true" bzw. "on".

Ihr könnt diese Zeile einfach mal in die Adresszeile Eures Browsers kopieren und mit Enter bestätigen. Die angezeigte Webseite solltet Ihr nun bearbeiten können.

Abschalten lässt sich das Ganze mit:

javascript: document.body.contentEditable = 'false'; document.designMode = 'off'; void 0

Der Code lässt sich verwenden, um Anmerkungen in eine Webseite zu schreiben, diese beispielhaft zu verändern oder natürlich auch um den eigenen Kontostand um ein paar Millionen nach oben zu korrigieren.