HTMLを文字列に変換する方法

Web ページの制作および開発では、送信、保存、操作などを容易にするために、HTML コードを文字列形式に変換する必要があることがよくあります。次に、HTML を文字列に変換する方法を見ていきます。

1. エスケープ関数を使用する

escape は、文字列内の非 ASCII 文字を %xx 形式に変換できる JavaScript の組み込み関数です。 HTML コードを処理する場合、エスケープを使用して HTML コードを文字列形式に変換できます。

サンプル コード:

var html = "<div>这是一段HTML代码</div>";
var str = escape(html);
console.log(str); // %3Cdiv%3E%E8%BF%99%E6%98%AF%E4%B8%80%E6%AE%B5HTML%E4%BB%A3%E7%A0%81%3C%2Fdiv%3E

注: エスケープを使用して変換された文字列は、unescape 関数を使用して元の HTML コードに変換する必要があります。

2. encodeURIComponent 関数を使用する

encodeURIComponent は、文字列内の特殊文字を %xx 形式に変換できる JavaScript の組み込み関数です。 HTML コードを処理する場合、encodeURIComponent を使用して HTML コードを文字列形式に変換できます。

サンプル コード:

var html = "<div>这是一段HTML代码</div>";
var str = encodeURIComponent(html);
console.log(str); // %3Cdiv%3E%E8%BF%99%E6%98%AF%E4%B8%80%E6%AE%B5HTML%E4%BB%A3%E7%A0%81%3C%2Fdiv%3E

注: encodeURIComponent を使用して変換された文字列は、decodeURIComponent 関数を使用して元の HTML コードに変換する必要があります。

3. innerHTML 属性を使用する

HTML 内の要素の innerHTML 属性は、要素の HTML コンテンツを取得または設定できます。 innerHTML 属性を通じて HTML コードを取得し、JSON.stringify() 関数を使用してそれを文字列形式に変換できます。

サンプル コード:

var html = "<div>这是一段HTML代码</div>";
var div = document.createElement("div");
div.innerHTML = html;
var str = JSON.stringify(div.innerHTML);
console.log(str); // "\"<div>这是一段HTML代码</div>\""

注: 変換された文字列には引用符が含まれます。eval() 関数を使用して元の HTML コードに変換する必要があります。

概要

上記は、HTML コードを文字列形式に変換する 3 つの方法です。それぞれの方法には長所と短所があり、状況に応じて適切な方法を選択できます。使用する場合は、変換された文字列を元の HTML コードに逆変換する必要があることにも注意する必要があります。

以上がHTMLを文字列に変換する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。