[b]...[/b]特別なテキストスタイルを示すために任意のマークアップを使用してその内容をXMLファイルに保存する単純なリッチテキストエディターを作成する必要があります（例：太字および斜体）。すべてのバックエンドPHPのものはかなり単純に見えますが、機能のフロントエンドWYSIWYG部分はもう少し複雑に見えます。現在利用可能なJavaScriptベースのWYSIWYGエディターのいずれかを使用することをためらっています。これは、許可するリッチテキストオプションが非常に限られており、これらのアプリケーションが完全に機能しているため、それらを提供するのに手間がかかるように思われるためです。必要な機能まで。[i]...[/i]
したがって、必要最低限のリッチテキストエディタの作成に着手する際に、私は3つのアプローチに遭遇しました。
- 最初の2つのアプローチでは、
contentEditableまたはdesignModeプロパティを使用して編集可能な要素を作成し、execCommand()メソッドを使用して選択した範囲に新しいテキストスタイルを適用します。- 最初のオプションは標準
div要素を使用し、その要素のコンテンツに対してすべてのスタイリングコマンドを実行します。
- 最初のオプションは標準
- 2番目のオプションは、
bodyで囲まれたウィンドウの編集可能ファイルを使用iframeし、親ドキュメントのボタンから開始されたスタイリングコマンドをそのウィンドウに渡してcontentWindow、含まれている本文の選択された範囲を変更します。これは、オプション1と同じ効果を達成するためのいくつかの追加の手順のように見えますが、編集可能なコンテンツを独自のドキュメントに分離することには利点があると思います。 - 3番目のオプションは、
textareaオーバーレイdivを使用し、oninputJSイベントを使用して、変更されるたびにinnerHTML入力テキストエリアに一致するようにバックグラウンドdivを更新します。明らかに、これには、テキストエリアの文字valueなどの要素をdivの文字に変換するために文字列を細かく調整する必要がありますが、これにより、潜在的に厄介なDOM操作をフロントエンド表示のみに任せながら、マークアップの整合性を維持できます。newline<br/>[/]
それぞれの方法のメリットとデメリットがわかります。ソリューションは最初は最も単純にcontentEditable見えますが、この機能のサポートはブラウザーによって異なる傾向があり、サポートするブラウザーごとに、実装時にDOMの操作が異なるようexecCommand()です。前に述べたように、textarea / divソリューションは、私の任意のスタイル規則を維持するための最良の方法のように見えますが、出力divにリッチテキストを表示するカスタム文字列操作手順はかなり厄介になる可能性があります。
それで、私はあなたに私の質問を提出します：私が概説した開発目標を考えると、あなたはどの方法を選びますか、そしてなぜですか？そしてもちろん、私が見落としている別の方法が私の目的に役立つかもしれない場合は、私に教えてください！
前もって感謝します！