たった一行で編集可能にする小技がScrapBook

やり方

[ロケーションバーに
javascript:document.body.contentEditable='true'; document.designMode='on'; void 0
を入れて、打ち込むだけ。

こんな感じ

これがScrapBookの「保存」にも効きました。ワロタ。
(せっかくScrapBookの付箋アノテーションがあるんだから、そっち使えよという話ですが・・)

つまり、マーカーで色を付けたり、「DOMイレーサー」で不要な箇所を消したあと、ページに何か書き加えた変更も「保存」できます。

※ただし、ScrapBookで保存時にcontentEditable="True"が残ります。消したい場合は最後まで読んでね。

詳しく知らないのですが、IE5.5からcontentEditableという独自要素が追加されまして、そのcontentEditable="True"がブラウザ上で反映されている場合は、編集可能な状態になっているんですね。Firefox3でも独自要素であるcontentEditableが反映されるようになっています(firefox2からかも。他のブラウザは知りません。)

ただし、「編集」は可能でも「保存」はできません。ブラウザで読み出されたときのhtmlなりphpなりをそのまま保存するわけですから、書き換わったページを保存するわけではないんです。

ところが、ScrapBookでは「保存」されていることが判明しました。

実験

こんなイレギュラーなやつでも


を入れて書き換えて

保存。

もう一度開くと・・・

書き換えが反映されています。

こんなものまで「編集」「保存」できるんですね。

普通のテキストファイルの場合は、

>javascript:document.body.contentEditable='true'; void 0
を打ち込むと、Fifefox君が頭を悩ませたあげく、

編集可能状態にはなりますが・・・

保存して開くと、残念。反映されません。


ただのテキスト


ただのテキスト


こいつらは、





ただのテキスト

こう書き換わります。

ならば、こいつはどうか?

>htmlと書いてない偽のhtm
拡張子をhtmにしているだけの、中身テキストですが、

書き換えて開いてみると





htmlと書いてない偽のhtm
に書き換え

と補完されたようです。

これで、だいたいわかってきましたね。

拡張子さえ合わせれば、ScrapBookで編集が保存できます。
html,htm,phpは大丈夫で、xmlはダメです。

元に戻してみよう

contenteditable="true"を無効にすればいいのですから、要素自体を消すか、"true"を"false"にすればいいです。

要素自体を消すならば、


※間違っても「」全体を消さないでください


書き換えならば、



でいいです。

−おしまい−

この話はScrapBook公式ブログのhttp://www.xuldev.org/blog/?p=174に出ていました。