はじめに
CSS用(backgroundのcontent)の数値文字参照を一発で出してくれるツールがすぐ見つけられなかったので作るついでにサロゲートペアに対応した状態にしました。💪とかも大丈夫です。
下記に変換ツールを公開しています!
文字列→数値文字参照ツール
この記事は変換部分だけ紹介しています。
実装
文字列→HTML数値文字参照
function stringToHtmlNumCharRef(string){
let result = "";
for(let val of string){
result += "&#x" + val.codePointAt(0).toString(16) + ";";
}
return result;
}
文字列→CSS数値文字参照
function stringToCssNumCharRef(string){
let result = "";
for(let val of string){
result += "\\" + val.codePointAt(0).toString(16);
}
return result;
}
解説
for...of文とcodePointAtがサロゲートペアに対応してるので、1文字ずつ16進数に変換してそれに必要な文字列をくっつけるだけです。