あれです。data:text/html,文字列 という形式でアプリケーションを書いてみようと思ったんですが、結局 Google Chroem でしか動かなかったという残念なアプリです。ですが、将来何かする時の参考データにはなるだろうと思って記録します。 使用する場合は、コピーしてアドレスバーに貼り付けるだけです。
data:text/html,<label for="check">div/textarea toggle</label> <input id="check" type="checkbox" onchange="if(this.checked){document.getElementById('edit').style.display='block';document.getElementById('div').style.display='none';document.getElementById('edit').value=document.getElementById('div').innerHTML;}else{document.getElementById('edit').style.display='none';document.getElementById('div').style.display='block';document.getElementById('div').innerHTML=document.getElementById('edit').value;}"><div id="div" contenteditable style="border:1px solid #ccc;height:calc(100% - 50px)"></div><textarea id="edit" style="display:none;width:100%;height:calc(100% - 50px);background-color:#f0f0f0"></textarea>
常に使用したい場合は、ブークマークバーにドラッグして名称を変更すれば良いです。 contenteditable 属性を div に適用しているので、他でコピーした HTML がそのままリアルに再現され、toggle すると、textarea に切り替わって転送されます。textarea で記述した内容はそのまま DIV 側にも反映されます。整形はできないので、オンラインツール等を使用するといいと思います。 サイズを calc 使って常に画面に収まるようにしているので、プロジェクタとかで Chrome 内のページとして拡大するといろんな使い方があると思います ▼ DIV に貼り付けて▼ 切り替えると HTML
タグ：CHROME
|
|
【Google Chromeの最新記事】
- Google Chrome デベロッパーツールの Tips And Tricks
- Google Chrome + Windows10 + PDF ビューア + 非埋込みフォント で正しいフォントが表示されない
- Google Chrome のエディタ機能を使用してローカルにある HTML と JavaScript のソースでブレークポイントを使用したデバッグを行う手順
- Google Chrome のコンソールが、『いらすとや』のイラストでいっぱいになった日
- Google Chrome で IFRAME を display:none で消してから表示すると、スクロールバーが消える。仕方ないので、visibility:hidden で代替
- Google Chrome 45.0.2454.93m コンボボックスのバグ( リストボックスでは起こりません )
- Google Chrome のカラーピッカーを使用して、#RGB 形式の色コードを取得する方法
- Google Chrome の「デベロッパーツール」で、実行済みのページのソースをクリップボードにコピーする
- Auto-Translate(Chrome 拡張) が、Chromeウェブストアから削除されていました
- Google Chrome : デベロッパーツールの table コマンドで、オプジェクトのプロパティをテーブル表示して Excel に貼り付ける
- Google Chrome と Firefox : JavaScript : Pointer Lock API
- List of Chrome URLs( chrome://chrome-urls/ ) / Chrome の内部ページの一覧
- Google Chrome デベロッパーツールの新しい 『Mobile emulation』という機能
- 今、Google Chrome で WEBアプリをテストするには、デベロッパーツールを開いておいてキャッシュを無効にする必要があるのをご存知ですか?
- Google Chrome を強制終了すると、後で『開いていたページを復元』できますが、ログイン状態も復元してしまいます。
- Google Chrome 拡張の『instant translate』という翻訳機能の翻訳ウインドウを大きくする
- Chrome リモート デスクトップ。出先から自宅、出先から仕事場へのアクセスする為の環境と注意事項( 出先は拡張のみ )
- Google Chrome を一旦削除してやっと正常になった症状
- マウスカーソル下の画像表示用 HTML コードをクリップボードにコピーする Google Chrome 拡張
- Google Chrome の拡張 / 1クリックで Javascript をオン・オフする
