1. ホーム
  2. javascript

[解決済み] JavaScriptでHTMLエンティティをエンコードする

2022-03-04 06:40:19

質問

私は、ユーザーがコンテンツを入力できるCMSに携わっています。問題は、ユーザーがシンボル ® ブラウザによっては、うまく表示されないことがあります。記号を検索し、対応するhtmlエンティティに変換する必要があるリストを設定したいと思います。例えば

® => ®
& => &
© => ©
™ => ™

変換後、それをラップする必要があります。 <sup> タグを使用すると、このようになります。

® => <sup>&reg;</sup>

特定のフォントサイズとパディングスタイルが必要なため。

sup { font-size: 0.6em; padding-top: 0.2em; }

JavaScriptはこのような感じでしょうか?

var regs = document.querySelectorAll('®');
  for ( var i = 0, l = imgs.length; i < l; ++i ) {
  var [?] = regs[i];
  var [?] = document.createElement('sup');
  img.parentNode.insertBefore([?]);
  div.appendChild([?]);
}

ここで、"[?]"は、よくわからないことがある、という意味です。

その他の詳細

  • 私はこれを純粋なJavaScriptで行いたいと考えています。 jQueryのようなライブラリが必要です、ありがとうございます。
  • バックエンドはRuby
  • Ruby on Railsで構築されたRefineryCMSを使用。

解決するには?

正規表現を使うと、指定されたユニコード範囲内の任意の文字を、そのhtmlエンティティに相当する文字に置き換えることができます。コードは次のようなものになります。

var encodedStr = rawStr.replace(/[\u00A0-\u9999<>\&]/g, function(i) {
   return '&#'+i.charCodeAt(0)+';';
});

このコードは、与えられた範囲(ユニコード00A0〜9999、およびアンパサンド、greater & less than)のすべての文字を、htmlエンティティに相当する文字に置き換えるもので、これは、単純に &#nnn; ここで nnn から取得したユニコード値です。 charCodeAt .

実際の動作はこちらでご覧ください。 http://jsfiddle.net/E3EqX/13/ (この例では、使用する要素セレクタにjQueryを使用しています。上記のベースコード自体は、jQueryを使用していません)

文字エンコーディングがUTF8であることを確認し、データベースが文字列をUTF8で保存していることを確認してください。あなたは まだ システムフォントの設定やその他の問題により、文字が正しく表示されない場合があります。

ドキュメンテーション