HTML Editor
HTML Editor — ブラウザで動作します。入力は保存されません。
HTMLソース · プレビュー
iframe の sandbox でスクリプトとフォームを遮断したプレビューです。
使い方
- HTMLソースに文書や断片のマークアップを入力します。
- プレビューを押すと下のプレビュー (sandbox)フレームに描画されます。
- スクリプトとフォームはサンドボックス制限で実行・送信されません。
- レイアウトだけ確認し、ソースを直してからプレビューを再度押します。
- リセットはソースを空にし、空の文書でフレームを更新します。コピーボタンはありません。
ポイント
HTMLエディタはソースとプレビューを1画面に置いたスケッチツールです。プレビューは隔離フレームに文書を入れ、サンドボックスを最大にしてスクリプト実行・フォーム送信・同一オリジンアクセスを止めます。バナー案や表マークアップを目で確認するときに向きます。ブラウザ全体の開発者ツールの代わりではなく、操作が必要なアプリはローカルサーバーで開く方がよいです。ソースが空でもプレビューを押すと空文書がフレームに入り、前の絵が消えます。
プレビューを押す前はフレームが空か前の結果が残ることがあるので、修正後は必ずボタンを押し直してください。ファイル保存やサーバーへのアップロードはありません。外部画像URLがあればネットワークで画像は読めますが、ページスクリプトは遮断されます。検査器・フォーマッタと併用すると構造点検と見た目確認を分けられます。コピーボタンがないので、ソース欄のテキストを自分で選択して持っていきます。
例
ソースに <h1>プレビュー</h1><p>こんにちは</p> を入れてプレビューすると、フレームに見出しと段落が描かれます。scriptタグを入れてもサンドボックスのため実行されません。内容を直したあとはプレビューを再度押さないとフレームが更新されず、リセットを押すと空文書に戻ります。
関連: HTMLフォーマッタ · HTML検査器 · Excel → HTML表
よくある質問
HTMLエディタのプレビューでJavaScriptは実行されますか？
実行されません。フレームのサンドボックスがスクリプトとフォームを止め、案の確認用だけです。
入力するたびにプレビューが変わりますか？
いいえ。プレビューボタンを押したときだけフレーム内容が更新されます。リセットも空文書を再描画します。
コピーボタンはありますか？
ありません。ソース欄のテキストを自分で選んでコピーし、プレビューは画面確認用です。
外部画像はプレビューに出ますか？
URLが有効なら画像は読み込まれることがあります。ただしスクリプト系ウィジェットは遮断されます。
ソースはサーバーに保存されますか？
保存されません。ソースとフレーム更新はブラウザ内だけです。リセットすると欄が空になります。
リセット後のフレームはどうなりますか？
ソースが消え、空文書がフレームに入り、前のプレビューが消えます。
最終確認日: 2026-09-04