3

DOM要素にID'myElement'を入力しようとしています。私が入力しているコンテンツは、テキスト要素とHTML要素の組み合わせです。

以下は、DOM要素に入力したいコンテンツであると想定します。

var x = "<b>Success</b> is a matter of hard work &luck";

次のようにinnerHTMLを使ってみました。

document.getElementById("myElement").innerHTML=x;

その結果、私の文の最後の単語が切り落とされました。どうやら、問題は最後の単語に存在する「＆」文字が原因です。'＆'とinnerHTMLをいじってみましたが、以下は私の観察です。

  1. コンテンツの最後の単語が10文字未満で、「＆」文字が含まれている場合、innerHTMLは「＆」で文を切り取ります。
  2. この問題はFirefoxでは発生しません。
  3. innerTextを使用すると、最後の単語はそのままになりますが、コンテンツの一部であるすべてのHTMLタグはプレーンテキストになります。

jQueryの#htmlメソッドを使用してデータを入力してみました。

 $("#myElement").html(x);

このアプローチはIEの問題を解決しますが、chromeの問題は解決しません。

すべてのブラウザで切り落とされることなく、最後の単語に「＆」が含まれるHTMLコンテンツを挿入するにはどうすればよいですか？

更新：1。DOMに挿入しようとしているコンテンツをhtmlエンコードしてみました。コンテンツをエンコードすると、コンテンツの一部であるhtmlタグがプレーンな文字列になります。

上記のコンテンツの場合、結果は次のようにレンダリングされると思います。

成功は努力と幸運の問題です

しかし、レンダリングされたページで実際に得られるものをエンコードすると、

<b>Success</b> is a matter of hard work &luck

4

3 に答える 3

6

&を に置き換える必要があります&amp;。

(&アンパサンド) 文字は、HTML 内でさまざまな特殊文字を表すために使用されます。たとえば&quot; = "、、、など。&lt; = <_ 現在、明らかに有効な HTML エンティティではありません (1 つのセミコロンがありません)。ただし、エラー修正 (セミコロン) の組み合わせと、HTML エンティティ (その後に 4 文字が続く) のように見えるという事実のために、さまざまなブラウザーがそのように解析しようとする場合があります。&luck&

&luck;は有効な HTML エンティティではないため、元のテキストは失われます。このため、HTML でアンパサンドを使用する場合は、常に&amp;.

更新: このテキストがユーザーによって入力された場合、この文字を適切にエスケープするのはあなた次第です。たとえば PHP ではhtmlentities、テキストをユーザーに表示する前に呼び出します。<script>これには、タグなどの悪意のあるユーザー コードを除外するという追加の利点があります。

于 2010-04-01T10:21:41.510 に答える
1

アンパサンドは HTML の特殊文字で、文字エンティティ参照または数字参照の開始を示します。次のようにエスケープする必要があります。

var x = "<b>Success</b> is a matter of hard work &amp;luck";
于 2010-04-01T10:23:04.627 に答える
0

代わりにこれを使用してみてください：

var x = "<b>Success</b> is a matter of hard work &amp;luck";

アンパサンドを HTML エンコードすることで、"&luck" と書いたときに意味が曖昧にならないようにしています。

于 2010-04-01T10:21:24.223 に答える