2017年7月27日(木)
HTML5 Editor for PC #HTML5&CSS3&JavaScript

　先日公開していたHTML5 Editorを、パソコン仕様に整えました。まずは、下記リンクで使ってみて下さい。

　このあと、グダグダ書きますが、ブラウザは、Google Chrome等 > Microsoft Edge > IE11の順で、お試し下さい。


　今までのエディタでは、<textarea></textarea>内に平文(Plain TEXT)を書かせていました。今回、リッチテキスト(Rich TEXT)との共存を図るために、平文も<div></div>内に書かせて、execCommand("insertText")で文字挿入だけに制限しました。

-- 改行でタグが異なる --
あい
うえお

<textarea></textarea>の場合
あい<br>うえお

<div></div>の場合
あい<div>うえお</div>
※あとになって、Chrome、Firefox、Safariで異なりを確認しました。もう少し研究します。
--


　次に、execCommand()のサポート状況です。

　execCommand("styleWithCSS")は、Microsoft EdgeとIE11で利用できません。HTML5で排除されたレガシータグで記述される部分があります。

--
<span style="color: red; font-size: x-large;">大きな赤色</span>
<font color="red" size="5">大きな赤色</font>

<span style="text-decoration-line: line-through;">取り消し線</span>
<strike>取り消し線</strike>
--

　太字、斜体は、Microsoft EdgeとIE11でも異なります。IE11は昔からのタグに縛られています。

--
太字
<span style="font-weight: bold;">Google Chrome</span>
<b>Microsoft Edge</b>
<strong>IE11</strong>

斜体
<span style="font-style: italic;">Google Chrome</span>
<i>Microsoft Edge</i>
<em>IE11</em>
--

　IE11では、execCommand("insertText")、execCommand("insertHTML")および多くのexecCommand()が利用できません。昔のやり方には戻りたくないので、文字挿入の機能についてはIEを対象外とします。

　文句を続けますが、Microsoft Edgeは、頻繁に停止したり、お気に入りが勝手に消えたりします。挙動不審な動作もあり、自分は既定のWebブラウザーは、Google Chromeに変更しています。

　Google Chrome等を利用されることをお勧めします。


P.S. 最近、プログラミングを説明するページは、英語表記にしています。インターネット検索すると、結構上位に食い込んでいて、外国からもアクセスがあるため、簡単な英語表記にしております。

P.S.2 社名は、日本語表記で『ガレコレ』ですが、英語表記では"Garage Collection"としています。
http://neconote.jp/prg/editor_pc.html