エス技研

WordPress、CakePHP、PHP、baserCMSなどの Web系システムを中心に情報を提供します!


数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)

      2017/03/12

テキストを数値文字参照コード(特殊文字コード)に変換するツール

 

数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)とは

 
数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)」ページへ
 
WordPressの投稿をするにあたって、自動的に変換される文字が結構あることを知り、それに対応するためのツールを提供することにいたしました。
 
「必要だから作ってみた」シリーズの第 7段目くらいです!
 
 
文字列を数値文字参照コードに変換するツールです。
きっかけは WordPressの自動変換される文字への対処でしたが、ツールとしては、HTMLを作成する際にも必要となる文字列を数値文字参照に変換するツールです。
 
この数値文字参照のコードは、HTMLの特殊文字コードと言ったり、エンティティ文字、HTMLエンティティ変換、エンティティ文字コードなどとも言われていて、HTML上のメールアドレスを隠す場合の変換などにも使われます。
文字参照としては、HTMLの特殊文字とも言われる HTMLタグを記述する際の「<br />」の「<」部分のことです。
 
これを変換するツールです。
 
 
また、WordPressでは具体的にどのような文字が自動変換されるのか、については下記に記事を書いていますので合わせて参照してください。
 「WordPressの記事編集で文字が自動変換される要注意な文字列
 「WordPressでダブルクォートなどの文字が自動変換?原因と対処方法
 「WordPressで ¥円マークが \バックスラッシュになる原因と対処方法
 
 

数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)の特徴

 
入力されたテキストを、「数値文字参照」の文字コードに変換するツールです。
10進数での表記と 16進数での表記に対応しています。
 
とはいえ、このツールは、変換系のツールの一つですので、取り立てて大きな特徴はありません。
入力されたテキストを「数値文字参照」の文字コードに変換するだけです。
 
入力されたテキストをコードに従って変換するだけですので、他のサイトのツールとの差別化は難しいところですね。
 
HTMLを記述する際によく使う特殊文字と呼ばれる文字参照の一覧を付けているくらいが差別化になるくらいでしょうか。
 
 

数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)の使い方

 
WordPressの記事を書く際に、HTMLのタグをそのまま表示したいときには「&lt;br />」と記述する必要があり「<」の文字参照のコードはなんだったかなぁ?なんていうときにこのサイトに来ていただいて、文字コードを変換します。
 
「入力」に変換する前の文字を入れ、「10進数の HTML数値文字参照」「16進数の HTML数値文字参照」のいずれかのボタンをクリックすると、「結果」に数値文字参照のコードが表示されます。
 
10進数表記と 16進数表記とありますが、10進数表記の方がいいでしょう。理由は後述します。
 
また、「改行も変換」にチェックを入れておくと改行も含めてコード変換を行います。
 
 

数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)の注意点

 
この「数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)」は、JavaScriptで動いていますので、JavaScriptが使える状態でご利用ください。
 
これは、一応お約束的に書いていますが、JavaScriptを Offにして使っている方はほぼいないんじゃないかと思いますので、取り立てて注意点はありません。
 
 


 

よく使う文字参照・数値文字参照・文字実体参照・特殊文字

 
せっかくの変換ツールの紹介記事ですが、わざわざ変換せずともよく使うコードはあらかじめ載せておけばいいじゃん!というコーナーです。
参考にどうぞ。
 

文字 文字実体参照 数値文字参照 説明
< &lt; &#60; 大なり
> &gt; &#62; 小なり
" &quot; &#34; ダブルクォート
' &apos; &#39; シングルクォート
& &amp; &#38; アンパサンド
  &nbsp; &#160; 半角スペース
© &copy; &#169; コピーライト
¥ &yen; &#92; 円マーク

 
 

文字参照・数値文字参照・文字実体参照・特殊文字について

 

文字参照・数値文字参照・文字実体参照・特殊文字とは?

 
ここで説明しています「文字参照」は、HTMLなどの文書の中で、直接記述できない文字や記号(マークアップに使われる「<」や「"」など)を記述するために用いられる方法です。
 
「文字参照」が正式な表現ですが、「特殊文字」という表現も広く使われていますので、「特殊文字」として理解している方も多いでしょう。
 
また、HTMLでは、「<」を「&lt;」として表現する文字実体参照と、「&#60;」として表現する「数値文字参照」の 2種類が存在します。
 
文字実体参照は、
 「<」を「&lt;」
 「"」を「&quot;」
の様に表現するため、何の文字か分かりやすい文字参照の形式です。
 
数値文字参照は、
 「<」を「&#60;」
 「"」を「&#34;」
の様に数値で表現しますので、何の文字か分かりにくい文字参照の形式です。
 
ですが、文字実体参照では表現できない文字もあるため、表現範囲の点で行くと数値文字参照の方が優れていることになります。
 
また、HTMLファイルに記述する際は文字実体参照と数値文字参照が混在していても何ら問題はありません。
 
 

数値文字参照は 10進数表記と 16進数表記がある

 
数値文字参照には 10進数表記と 16進数表記があります。
 
それぞれ下記のような表記になります。
10進数
 「<」を「&#60;」
 「"」を「&#34;」
 
16進数
 「<」を「&#x3c;」
 「"」を「&#x22;」
 
16進数表記の場合は「#」のうしろに「x」が入ります。
また、「x」は大文字の「X」でも問題ありません。
 
10進数と 16進数とどちらを使っても問題ありませんが、ブラウザがサポートしているのは 10進数のコードの方が範囲が広いと言われていますので、10進数表記をしておく方が無難です。
 
 

文字参照・数値文字参照・文字実体参照は特殊文字ではない

 
文字参照(数値文字参照、文字実体参照)で表現される文字を、HTMLを表記する際に「<」や「"」を表記するために使うコードという理解をしている方は、文字参照で現す文字は「特殊な文字」、「特殊文字」として見えてしまいます。
 
ですが、実際には特殊な一部の文字にだけ文字参照のコードが割り振られているわけではありません。
 
例えば
 「a」は「&#97;」
 「b」は「&#98;」
 「c」は「&#99;」
の様にすべての文字に数値文字参照のコードが割り振られています。
 
この記事で紹介している「数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)」は、その入力された文字を数値文字参照のコードに変換するツールなわけですが、特殊な処理をしているわけではなく、入力された文字のコードを表示しているにすぎません。
 
また、日本語も同じように数値文字参照のコードが割り振られていますので、テキストで入力せず、全ての文字を数値文字参照のコードで記述しても全く問題はありません。
とはいえ、それはすごい手間な作業になりますので、HTMLを記述する際には「<」や「"」など問題になる文字だけを置き換えて記述している、ということなのです。

 - PHP・Smarty・ECCUBE

GoogleAdwords

GoogleAdwords

最後までお読みいただきましてありがとうございます。
この記事が参考になったと思いましたらソーシャルメディアで共有していただけると嬉しいです!

Message

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

下記の空欄を埋めてください。 * Time limit is exhausted. Please reload CAPTCHA.

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

※入力いただいたコメントは管理者の承認後に掲載されます。

  関連記事

ECCUBEでカード決済NGの受注情報をマイページ購入履歴に表示しない方法解説

ECCUBEでカード決済に失敗しても購入履歴一覧に注文情報(受注情報)が表示される問題への対処方法を解説。受注情報レコードの作成の流れとステイタスについても解説。

路線・駅検索のために緯度経度からPHPで簡易的に距離を計算する処理解説
路線・駅検索のために緯度経度からPHPで2点間の距離を計算する処理解説

路線・駅検索の仕組みの構築は大変。それを簡易に実装するために緯度経度を元に距離計算をする仕組みを考案。まずは2点間の距離を計算する仕組みを解説し、距離計算にまつわる関連技術も紹介。

PHPパーミッション変更のchmod関数・モードを変数で指定する方法

パーミッション変更関数であるchmod関数の第二引数、ファイルモードの指定に変数を使う場合は8進数に変換するoctdec関数を使って変換します。

PHPでスクレイピング。phpQueryとphp-simple-html-dom-parserの比較と設置方法
PHPでスクレイピング。phpQueryとphp-simple-html-dom-parserの比較と設置方法

「PHP スクレイピング」で検索すると「phpQuery」ばかりヒットするが、10年以上も放置されている。なので今も開発が続いている「PHP Simple HTML DOM Parser」をオススメする。

XML形式の値を配列形式に変換・PHPでは simplexml_load_string()
XML形式の値を配列形式に変換・PHPでは simplexml_load_string()

XMLとは「Extensible Markup Language」の略でテキストベースのデータフォーマット。XMLをPHPで配列に変換するWebツールの紹介とその処理「simplexml_load_string()」関数についての解説。

Smartyの修飾子regex_replaceで正規表現の後方参照・PHPではpreg_replace

ECCUBEで使われているSmartyで文字列を正規表現で置換し後方参照で値を利用する装飾子regex_replaceの解説です。細かな条件がありますので注意が必要です。

WindowsのXAMPPのPHPではstrptimeは使用不可。代替はdate_parse_from_formatを使う
WindowsのXAMPPのPHPではstrptimeは使用不可。代替はdate_parse_from_formatを使う

strptimeはWindowsのPHPには未実装。LinuxとMacで挙動が異なる。PHP8.1で非推奨になる。なので日付のチェックはdate_parse_from_formatを使おう。使い方を詳細解説。

ECCUBEでテンプレートファイルのファイルサイズは10MB以下のものを使用してくださいのエラーが出た場合

テンプレートをアップロードする際にファイルサイズが大きすぎてエラーが表示される際の対処方法解説。パラメータ設定で設定する制限について解説を行っています。

ファイル変更だけ!ECCUBEの本番から開発環境をコピーする手順を解説

ECCUBEを本番から開発環境をコピーする際の手順を解説。PGMメンテに必要な開発環境を構築する手順を解説。ECCUBEの仕組みは簡単なので作業は5分ほど。

乱数発生器(パスワード生成サービス)がバージョンアップで高速化!
乱数発生器(パスワード生成サービス)がバージョンアップで高速化!

乱数やパスワードを生成する乱数発生器を高速化!重複しない10桁、20桁の文字列を10万件、20万件と生成することも可能!イベントのキャンペーンのシリアルコードなどにも利用可能!