MozillaZine.jp フォーラム • 返信する

HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

モデレータ: Forum Moderators

掲示板トップ » 相互ユーザーサポート » Mozilla Firefox

All times are UTC + 9 hours

返信する

ユーザー名:

件名:

オプション:

BBCode: ON

[img]: ON

[flash]: OFF

[url]: ON

スマイリー: ON

スマイリー

スマイリーを全て表示する

トピックのレビュー

	BBCode を無効にする
フォントサイズ:
	フォントカラー
	スマイリーを無効にする
	URL を自動的にパースしない
	ユーザエージェントを表示する

認証コード

認証コード:*

上の画象に表示されている文字を入力してください。各文字は大文字・小文字の区別があります。

トピックのレビュー - HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

作成者

メッセージ

呑兵衛あな

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

EarlgreyTea様、Ryo様、レスいただきありがとうございます。

EarlgreyTea様が言われる推測は、livedoorブログを利用してきた私の感覚としては、おそらく、たぶん、ほとんど、当たっているように思っています。
しかし、教えていただいた「ユーザーエージェントの変更アドオン」が英語だらけで、日本語しか知らない私の知識では手に余りました。

Ryo様。
教えていただきましたように、about:configから「editor.use_div_for_default_newlines」を検索し、値をfalse に変更したところ、「HTML文で『123<br />』が『<div>123</div><br />』と記述される」事は無くなりました。
これにて当分利用してみます。

色々と御世話になりました。

Posted: 2018年5月17日(木) 10:29

Ryo

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

呑兵衛あなさんが書きました:

本件と同様の内容について、別のlivedoorブログ利用者がlivedoorブログに質問したところ、『頂いた回答は”Firefox60.0の仕様変更によるものなので別ブラウザをご利用下さい。”とのことでした。』との事です。

呑兵衛あなさんが書きました:

私は、まるっきりのド素人です。「about:config」から弄る程度ならば、理解できるかしらん(?)というレベルです。

livedoorブログ側が今回のFirefox 60 からの仕様変更に追従しないようであれば､
以前紹介した Bug 1430551 - Make defaultPargraphSeparater <div> in release build に
記載されている about:config の下記設定を利用すれば Firefox 59 までの挙動に戻せるようです｡

コード:

editor.use_div_for_default_newlines ; false

当方の確認では上記項目を false に変更すれば大丈夫そうな印象ですが､
livedoorブログで試しているわけではない事をご承知下さい｡

ただ､仮に livedoorブログでの挙動が以前の所望の動作に戻っても､
他のサイトでの挙動はサイト運営者が Webブラウザやそのバージョンを判定して
動作を切り替えていると想定外の動作になるかもしれませんね...｡

Posted: 2018年5月17日(木) 03:38

EarlgreyTea

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

呑兵衛あなさんが書きました:

了解です。
livedoorブログではFirefox 60の仕様変更を認識しているが、エディタを改修して対応させる予定はない、ということのようですね。

呑兵衛あなさんが書きました:

『document.execCommand() で実現』する方法は難しいのでしょうか??

あれはエディタアプリを利用する人向けではなくて、エディタアプリを作る人向けの記事なのです。
エディタの利用者がそれでなんとかできるわけではありません。

ところで、私は

引用:

ブログのエディタ側でブラウザの種類によって処理を分けて、同じ挙動になるようにケアしているのではないか

という推測をしました。
そして、

引用:

幸い、最新のブラウザーではこれらが多少統一されています。Firefox 55 では Chrome、最新の Opera、Edge、Safari に合わせて、<div> 要素で行をくくるように更新しました。

私の推測が当たっていたら、ひょっとすると、Firefox 60 で Chrome や Edge のユーザーエージェントに偽装するとうまくいく、かもしれません。

あくまで、ひょっとすると、ですが。

ちなみ、ユーザーエージェントの変更はアドオンを使うと簡単です。
https://addons.mozilla.org/ja/firefox/addon/uaswitcher/

Posted: 2018年5月17日(木) 00:48

呑兵衛あな

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

[START]本件と同様の内容について、別のlivedoorブログ利用者がlivedoorブログに質問したところ、『頂いた回答は”Firefox60.0の仕様変更によるものなので別ブラウザをご利用下さい。”とのことでした。』との事です。[/START]
[START]http://blog.livedoor.jp/fs00r612/archives/52080350.html[/START]

[START]そのため重ねて質問いたします。[/START]
[START]以前教えていただいた「Firefox 60 for developers - Mozilla | MDN」によれば、『アプリで以前の動作を望む場合は、document.execCommand() で実現できます。詳しくはマークアップ生成の違いをご覧ください (in release build" rel="noopener">バグ 1430551)。』とのことですが、『document.execCommand() で実現』する方法は難しいのでしょうか??[/START]

[START]私は、まるっきりのド素人です。「about:config」から弄る程度ならば、理解できるかしらん(?)というレベルです。[/START]
[START]「あきらめろ」という回答でも結構ですから教えてください。[/START]

Posted: 2018年5月16日(水) 20:20

偶然的通行人

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

横から失礼します。

深入りする気はありませんが、この件をテストしたいユーザー向けに関連情報を紹介しておこうと思います。

EarlgreyTea さんからご紹介のあったページ
・リッチテキストエディターの改行時の挙動が変更され、<br> の代わりに <div> が生成されます | Firefox サイト互換性情報
www.fxsitecompat.com/ja/docs/2018/rich-text-editor-s-newline-behaviour-has-been-changed-now-generates-div-instead-of-br/
この文書の冒頭部分にあるリッチテキストエディターのリンク先ページに "Mozilla におけるリッチテキスト編集 - HTML | MDN" のドキュメントがあります。
そのページの下方に "リソース" の項目があり、"mozilla.org のリッチテキスト編集デモ" のページにアクセスできます。
（参考）
・Mozilla Rich Text Editing Demo
www-archive.mozilla.org/editor/midasdemo/

入力エリアへの文字入力・編集後、下にある [View HTML Source] にチェックを入れると、結果の HTML ソースが表示されます。

ぼくは livedoor Blog を使っていないので、そのブログエディタ（「シンプルエディタ」というのでしょうか？）と個々のブラウザの組み合わせを試すことはできません。

EarlgreyTea さんが書きました:

実際にどういうHTMLになるかは、本件の場合は livedoorブログのエディタの仕様しだい（この仕様についてはlivedoorブログにお問い合わせください）ということになります。

と仰っているように、ブログサイトが提供するエディタの仕様が変われば、結果も変わることがあるとは思います。
なので、だれでもアクセス可能な上記のデモページで、Firefox の異なるバージョン、Google Chrome や Internet Explorer など他のブラウザの編集時の動作を試してみることで、ひとつのエディタでの挙動の変化を客観的に比較できるのではと思います。

Firefox 60 での本件に関する変更をふまえ、呑兵衛あなさんが仰っている動作結果が、（a）意図通りに変更された結果なのか、（b）変更はしたがバグがあって正常に働いていないのか、（c）エディタ側の仕様が影響しているのか等々、そのあたりはぼくには判断できませんが、可能な限り客観性のある比較をしないと、"特定ユーザーがおこなう特定環境での結果" という話で終わってしまいかねません。

とりあえず以上です。役に立たない話だったらすみません。

（おことわり）
現在、健康上の制約により不定期な書き込みしかできなくなっています。すぐに応答できない場面がかなり多くなりますことを、ご容赦ください。

Posted: 2018年5月12日(土) 18:54

呑兵衛あな

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

EarlgreyTea様
色々と御配慮いただきありがとうございます。
向後ともよろしくおねがいします

Posted: 2018年5月12日(土) 18:43

EarlgreyTea

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

一部、誤解やご理解いただけていない部分があるようです。

呑兵衛あなさんが書きました:

2.「マークアップ生成の違い - コンテンツを編集可能にする - HTML | MDN」の記述は先ほど読みました。

それによれば、『Firefox 55が他のブラウザに合わせて、<div> 要素で行をくくるように更新』とのことですが、少なくとも本件を質問した私の環境ではそうではありません。

１．
「マークアップ生成の違い」から引用した説明にFirefox 55と書かれていたのは開発版なので気にしないでください。
実際に通常版に仕様変更が反映されたのはFirefox 60になります。
＝＞リッチテキストエディターの改行時の挙動が変更され、<br> の代わりに <div> が生成されます | Firefox サイト互換性情報

２．

引用:

おそらくエディタ側でブラウザ種類を判定して処理分けしていて、<br>要素を挿入して改行するようにしているのでしょう。Firefox側で行を<div>で括り、Firefoxだから<br>入ってるはずだけど入ってなかったからエディタは<br>を入れた

という私の推測について、ご理解いただけていないようです。

ブログのエディタ側でブラウザの種類によって処理を分けて、同じ挙動になるようにケアしているのではないかという推測です。
このことは、Firefoxをアップデートする前は、各主要ブラウザの仕様が異なるにもかかわらず同じ挙動だった、ということが根拠になります。
つまり、エディタはFirefoxなら改行で<br>を入れてくることを期待して、それ用の処理をしているのではないかということです。
しかし、Firefoxの仕様が変わって<div>になったが、エディタ側の処理が同じだったらどうなるか？

その結果が、

コード:

なのではないかと思っています。

呑兵衛あなさんが書きました:

以上、(1)と(2)を併せて考えますと、livedoorブログに本件を報告しても、解消する見込みは無いだろうと読んでいます。

また、私の環境でのみ発生しているとも考えられますので、本件は報告ということで決了したいと思います。

３．
さきほど、反応していただけるかわかりませんが、公式Twitterに投げておきました。
また、本件は環境依存ではなく、私自身は確認できませんが Firefox 60でlivedoorのエディタなら再現性がある現象、と考えるのが自然かと思われます。

Posted: 2018年5月12日(土) 18:20

呑兵衛あな

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

先の投稿で誤記入がありました。

>これにより現在、Firefox 64bit 版: Firefox 58.0.3 (日本語) にしました。
は、正しくは
Firefox 64bit 版: Firefox 59.0.3 (日本語)
です、

Posted: 2018年5月12日(土) 17:15

呑兵衛あな

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

先の書き込みにて「本件は報告ということで決了したいと思います。」と申しましたが、以下の記事を参考にして念のためFirefoxのバージョンダウンを行ってみました。
以前のバージョンの Firefox をインストールするには | Firefox ヘルプ

これにより現在、Firefox 64bit 版: Firefox 58.0.3 (日本語) にしました。
結果、本記事で報告報告した『123<br />』が『<div>123</div><br />』と記述されるようになった不具合は解消されました。
また、Firefoxのバージョンダウンは単純にDLLして上書きしただけですが、別スレの「Firefoxのバージョン表示の(x64 ja)が(x64 en US)に変わってしまう」件が解消され、(x64 ja)となりました。

以上のことから、「マークアップ生成の違い - コンテンツを編集可能にする - HTML | MDN」にて『<div> 要素で行をくくるように更新しました。』と記載された事は、少なくとも私の環境には当てはまりません。

Posted: 2018年5月12日(土) 17:11

呑兵衛あな

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

EarlgreyTeaさん
色々と教えていただき、本件は判りました。
しかし、一点だけ

1.本件については、まだlivedoorブログに質問は行っていません。
質問してもブラウザのせいとかでを色々たらい回しされますので、殆どあきらめています。
報告はしますが、回答を期待するものではありません。

2.「マークアップ生成の違い - コンテンツを編集可能にする - HTML | MDN」の記述は先ほど読みました。
それによれば、『Firefox 55が他のブラウザに合わせて、<div> 要素で行をくくるように更新』とのことですが、少なくとも本件を質問した私の環境ではそうではありません。
本件を報告した当初の記事にも書きました通り『Chrome(v66.0.3359.139 64 ビット)やMicrosoft Edge、IE 11は、以前も現在も『123<br />』と記述されます。』ということです。
また『Firefox 59.0.2迄は『<br />[b]要素で行をくくられていた』のが、[/b]Firefox 60.0になってから『[b]<div> 要素で行をくくる』ようになった、ということです。[/b]

ちなみに
>注記: Internet Explorer はもはや開発されておらず、<div> ではなく <p> 要素を使用します。
とのことですが、「はてなプログ」にもlivedoorブログと類似した機能が有りますが、それでは[b]Chrome(v66.0.3359.139 64 ビット)やMicrosoft Edge、IE 11、[/b]Firefox 60.0共に <p> [b]要素で行がくくられます。[/b]<div>要素ではありません。

以上、(1)と(2)を併せて考えますと、livedoorブログに本件を報告しても、解消する見込みは無いだろうと読んでいます。
また、私の環境でのみ発生しているとも考えられますので、本件は報告ということで決了したいと思います。

[b]EarlgreyTeaさん[/b]
[b]色々と教えていただき、本件は判りました。[/b]
[b]しかし、一点だけ[/b]

[b]1.本件については、まだlivedoorブログに質問は行っていません。[/b]
[b]質問してもブラウザのせいとかでを色々たらい回しされますので、殆どあきらめています。[/b]
[b]報告はしますが、回答を期待するものではありません。[/b]

[b]2.「[/b][b][url=https://developer.mozilla.org/ja/docs/Web/HTML/Content_Editable#Differences_in_markup_generation]マークアップ生成の違い - コンテンツを編集可能にする - HTML | MDN[/url]」の記述は先ほど読みました。[/b]
[b]それによれば、『Firefox 55が他のブラウザに合わせて、<div> 要素で行をくくるように更新』とのことですが、少なくとも本件を質問した私の環境ではそうではありません。[/b]
[b]本件を報告した当初の記事にも書きました通り『[/b][b]Chrome(v66.0.3359.139 64 ビット)やMicrosoft Edge、IE 11は、以前も現在も『123<br />』と記述されます。』ということです。[/b]
[b]また『Firefox 59.0.2迄は『<br />[/b][b][b]要素で行をくくられていた[/b]』のが、[/b][b]Firefox 60.0になってから『[/b][b][b]<div> 要素で行をくくる[/b]』ようになった、ということです。[/b]

[b]ちなみに[/b]
[b]>[/b][b]注記: Internet Explorer はもはや開発されておらず、<div> ではなく <p> 要素を使用します。[/b]
[b]とのことですが、「はてなプログ」にもlivedoorブログと類似した機能が有りますが、それでは[/b][b][b]Chrome(v66.0.3359.139 64 ビット)やMicrosoft Edge、IE 11、[/b][/b][b]Firefox 60.0共に[/b][b] <p> [/b][b][b]要素で行がくくられます。[/b][/b][b]<div>要素ではありません。[/b]

[b]以上、(1)と(2)を併せて考えますと、livedoorブログに本件を報告しても、解消する見込みは無いだろうと読んでいます。[/b]
[b]また、私の環境でのみ発生しているとも考えられますので、本件は報告ということで決了したいと思います。
[/b]

Posted: 2018年5月12日(土) 16:24

EarlgreyTea

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

Ryo さんが書きました:

これは､以下の変更が関与する件でしょうか?

Firefox 60 for developers - Mozilla | MDN

アドバイスありがとうございます。まさしくその件でしょう。

呑兵衛あなさんが書きました:

本質問は、「シンプルエディタ」を用いて

123

と記述し、それを「HTMLエディタ」で見た場合、

ご返答ありがとうございます。

エディタ内に「123」と入力してEnterキーを押したわけですね。

Ryo さんが提示してくれた件は、WEB上でテキスト編集してる際にEnterキーを押した場合、以前は<br>要素を挿入していたけども、Firefox 60から<div>要素を挿入する仕様になったということです。
実際にどういうHTMLになるかは、本件の場合は livedoorブログのエディタの仕様しだい（この仕様についてはlivedoorブログにお問い合わせください）ということになります。

その結果が

呑兵衛あなさんが書きました:

『123<br />』と記述されていたのが『<div>123</div><br />』と記述されるようになった

ということなのでしょう。

おそらくエディタ側でブラウザ種類を判定して処理分けしていて、<br>要素を挿入して改行するようにしているのでしょう。Firefox側で行を<div>で括り、Firefoxだから<br>入ってるはずだけど入ってなかったからエディタは<br>を入れた…そんなところだろうと推測します。

ちなみに、
マークアップ生成の違い - コンテンツを編集可能にする - HTML | MDN

引用:

幸い、最新のブラウザーではこれらが多少統一されています。Firefox 55 では Chrome、最新の Opera、Edge、Safari に合わせて、<div> 要素で行をくくるように更新しました。

注記: Internet Explorer はもはや開発されておらず、<div> ではなく <p> 要素を使用します。

でありますので、エディタの方でブラウザ種類で処理を変えているだろうということがわかります。

[quote="Ryo"]これは､以下の変更が関与する件でしょうか?

[url=https://developer.mozilla.org/ja/Firefox/Releases/60#Changes_for_web_developers]Firefox 60 for developers - Mozilla | MDN[/url][/quote]アドバイスありがとうございます。まさしくその件でしょう。

[quote="呑兵衛あな"]本質問は、「シンプルエディタ」を用いて
[blockquote]123

[/blockquote]
と記述し、それを「HTMLエディタ」で見た場合、[/quote]ご返答ありがとうございます。

エディタ内に「123」と入力してEnterキーを押したわけですね。

Ryo さんが提示してくれた件は、WEB上でテキスト編集してる際にEnterキーを押した場合、以前は<br>要素を挿入していたけども、Firefox 60から<div>要素を挿入する仕様になったということです。
実際にどういうHTMLになるかは、本件の場合は livedoorブログのエディタの仕様しだい（この仕様についてはlivedoorブログにお問い合わせください）ということになります。

その結果が[quote="呑兵衛あな"]『123<br />』と記述されていたのが『<div>123</div><br />』と記述されるようになった[/quote]ということなのでしょう。

おそらくエディタ側でブラウザ種類を判定して処理分けしていて、<br>要素を挿入して改行するようにしているのでしょう。Firefox側で行を<div>で括り、Firefoxだから<br>入ってるはずだけど入ってなかったからエディタは<br>を入れた…そんなところだろうと推測します。

ちなみに、
[url=https://developer.mozilla.org/ja/docs/Web/HTML/Content_Editable#Differences_in_markup_generation]マークアップ生成の違い - コンテンツを編集可能にする - HTML | MDN[/url]
[quote]幸い、最新のブラウザーではこれらが多少統一されています。Firefox 55 では Chrome、最新の Opera、Edge、Safari に合わせて、<div> 要素で行をくくるように更新しました。

注記: Internet Explorer はもはや開発されておらず、<div> ではなく <p> 要素を使用します。[/quote]でありますので、エディタの方でブラウザ種類で処理を変えているだろうということがわかります。

Posted: 2018年5月12日(土) 13:23

呑兵衛あな

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

Ryo様。名前を間違えてすみませんでした。
ちなみに、Ryo様の言われるレベルは私には理解が及びません。

EarlgreyTea様の質問にお答えします。
>livedoorブログの説明ページを見ますと、ブログ投稿の際の編集画面で．．．

ついては仰せの通りです。
livedoorブログが提供するWebオーサリングツールを用いた場合に関する事です。livedoorブログでは「シンプルエディタ」と称しており、『改行を反映する…エディタ内での改行を<br />の改行タグとして反映させるため、改行のたびにタグを打つ必要がなくなります。』と説明されています。
livedoorブログでは「シンプルエディタ」と「HTMLエディタ」と称する物が提供されており、何れのエディターを使うかは同じ画面を切り替える事でユーザーが選択できます。
本質問は、「シンプルエディタ」を用いて

123

と記述し、それを「HTMLエディタ」で見た場合、v59.0.2迄は(HTML文で)『123<br />』と記述されていたのが『<div>123</div><br />』と記述されるようになったという事を述べたつもりです。
ということでEarlgreyTea様の逐次の質問に答えたつもりなのですが．．．返事になっていないかもしれません。
いずれにしても
>livedoorブログに問い合わせをしていただいて、ブラウザの問題なのかの切り分けをしていただいた方がいいのかなと思います。
そのようにいたす所存です。お騒がせしました。

Posted: 2018年5月12日(土) 11:33

呑兵衛あな

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

EarlgreyTea様、Moderator様、レスいただきありがとうございます。

EarlgreyTeaのおっしゃるように具体的に書きたいと思います。
しかし、いかんせん私はこのフォーラムでの画像の張り方などがちんぷんかんぷんです。
また、本日午前中は通院のため、この後の書き込みが遅れてしまいますことを申し上げます。
明日になるかも知れませんが、ご容赦いただけますようにお願いします。

Posted: 2018年5月12日(土) 09:13

Ryo

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

これは､以下の変更が関与する件でしょうか?

Firefox 60 for developers - Mozilla | MDN

引用:

HTML

designMode および contenteditable の状況で、ブロックレベルの編集ホストの子であるインライン要素またはテキストノードの内部にキャレットがあるときに Enter キーを押下すると、<div> 要素を挿入するようになりました。以前は、<br> 要素を挿入していました。アプリで以前の動作を望む場合は、document.execCommand() で実現できます。詳しくはマークアップ生成の違いをご覧ください (バグ 1430551)

的外れでしたらスイマセン｡

Posted: 2018年5月12日(土) 07:59

EarlgreyTea

記事の件名:

Re: HTML文で『123<br />』が『<div>123</div><br />』と記述されるようになった

呑兵衛あなさんが書きました:

ローカルな話題で恐縮ですが、私はlivedoorブログをレンタルして記事を書いているのですが、
Firefox v60.0(64ﾋﾞｯﾄ)になったら、v59.0.2迄はHTML文で『123<br />』と記述されていたのが『<div>123</div><br />』と記述されるようになってしまいました。
なお、Chrome(v66.0.3359.139 64 ビット)やMicrosoft Edge、IE 11は、以前も現在も『123<br />』と記述されます。

私は livedoorブログを利用したことがありませんので状況がよくわかりません。
ブログの編集画面を見たことがない人でもわかるように、具体的かつ正確にご説明をお願いいたします。

以下、不明点をお尋ねしますのでお答いただけますでしょうか。

「HTML文で『～』と記述」の部分の意味を掴みかねております。

livedoorブログの説明ページを見ますと、ブログ投稿の際の編集画面で、

引用:

見たままに文字装飾や画像貼り付けができるリッチエディタや
HTMLを直接編集できるシンプルエディタを用意。

とあります。

添付ファイル:

livedoorブログエディタ.jpg [ 124.73 KiB | 表示数: 82233 回 ]

質問1：どちらのエディタを使って編集された場合の話でしょうか？
質問2：「記述」の意味するところは、呑兵衛あなさんが『』内のHTMLを入力したということでしょうか？　違いましたら実際に入力したものを教えてください。
質問3：「記述」の意味するところは、ブラウザを使ってブログ編集を行った結果、出来上がったブログ記事のHTMLソースを表示させたら『』内のようになっていたということでしょうか？
質問4：質問3の意味だったとした場合、各ブラウザで編集した結果を見ることはできますか？

ひとまず、livedoorブログに問い合わせをしていただいて、ブラウザの問題なのかの切り分けをしていただいた方がいいのかなと思います。
問い合わせは以下からできるようです。

■質問や要望
livedoor Blogの公式Twitter： https://twitter.com/livedoorblog

■問題報告フォーム
https://contact-cc.line.me/livedoor/

Posted: 2018年5月11日(金) 22:22

掲示板トップ » 相互ユーザーサポート » Mozilla Firefox

All times are UTC + 9 hours