HTMLファイル内の中国語の文字化けとブラウザでの表示の問題

HTMLファイル内の中国語の文字化けとブラウザでの表示の問題

今日も私のページが文字化けしていたので、インターネットで関連する問題を検索しました。この方法はかなり良いようです。私も試してみました。editpエディタを使用しました。ドキュメント-ファイルエンコーディング-ファイルエンコーディングの変更-必要なエンコーディングを選択します。

Web ページでは、中国語の文字化けの問題が頻繁に発生します。以前、文字化けに遭遇したときは、成功するまでさまざまなエンコード方法を試し続けました。昨日、プロジェクトで再びこの問題が発生したので、簡単なテストを実行しました。

HTML ファイルには、「UTF-8」、「GBK」などのエンコード方式があります。これらはメモ帳では表示されないかもしれませんが、Eclipse では HTML ファイルのエンコード方法を設定できます。次の図で説明します。

テスト1:

html ファイルを「UTF-8」モードで保存します。具体的なファイルの内容については、下の図を参照してください。

図からわかるように、ファイルのエンコーディングは「UTF-8」で、下の赤枠の「その他」は Eclipse で設定されています。画像の上の赤いボックスは、ブラウザがファイルを開くために使用するエンコード方式を示しており、「UTF-8」と表示されます。

IE を使用してファイルを開くと、次の画像が表示されます。

ブラウザのエンコード方式を確認すると、ブラウザが自動的に「UTF-8」方式を選択し、文字化けが発生しないことがわかります。

ブラウザのエンコードを「GB2312」に切り替えると、次の画像が表示されます。

テスト2:

HTML ファイルを「UTF-8」モードで保存し、ファイル ヘッダーのエンコードを次のように「GBK」に設定します。

これは、ファイルのエンコーディングが「UTF-8」であり、デフォルトのファイルオープン方法が「GBK」であることを示します。

IE を使用してこのファイルを開いたスクリーンショットは次のとおりです。

HTML ファイルの指示に従って、ブラウザが「GB2312」モードで開いていることがわかります。ファイル自体は「UTF-8」でエンコードされているため、文字化けした文字が表示されます。しかし、Web ページのソース ファイルは文字化けしていません。

ブラウザのエンコード方式として「UTF-8」を選択すると、文字化けが消えることがわかります。スクリーンショットは次のとおりです。

これでテストは終了です。次の点を要約します。

1. HTML ファイルにはエンコード形式があり、特定のエディターでのみ表示および設定できます。

2. HTML ファイルのヘッダーの「content-type」に設定された「charset」は、ファイルを開くときに使用するエンコード方法をブラウザに伝えます。

3. 一般的に、ポイント 1 と 2 のエンコード方法は一貫している必要があります。一貫性がない場合、文字化けが発生する可能性があります。

4. ブラウザで文字化けした文字が表示されても、ページのソース ファイルは文字化けしていない場合は、ブラウザのエンコード方法を変更することで正しい中国語が表示されます。ソース ファイルに正しい「charset」が設定されている場合は、ブラウザのエンコード方法を変更する必要はありません。

<<:  Javascript 構造化代入の詳細

>>:  Navicat for Mysql 接続エラー 1251 (接続失敗) の問題を解決する

推薦する

WeChatミニプログラムページで値を返す4つの解決策のまとめ

目次使用シナリオ解決1. globalDataを使用して実装する2. ローカルキャッシュストレージを...

TypeScript 3.7 で注目すべき 3 つの新機能について簡単に説明します。

目次序文オプションの連鎖ヌル結合呼び出されていない関数のチェック他の序文TypeScript 3.7...

JavaScript におけるイベント バブリング メカニズムの詳細な分析

バブリングとは何ですか? DOM イベント フローには、イベント キャプチャ ステージ、ターゲット ...

MySQL 5.7.10 winx64 のインストールと設定方法のグラフィック チュートリアル (win10)

MySQL は比較的使いやすいリレーショナル データベースです。今日は、win10 システムを再イ...

JS に依存せずにレスポンシブ レイアウトを実現する CSS3 モバイル vw+rem メソッド

1. はじめに(1)vw/vhの紹介使用する前に、vw と rem とは何か、その機能について簡単に...

Promise カプセル化 wx.request メソッド

前回の記事では、Promise を使用して小さなプログラム wx.request をカプセル化する実...

Ubuntu16.04にclionをインストールするプロセス全体と手順の詳細な説明

CLion のプロセス全体を最初から説明します。CLion は、JetBrains がリリースした新...

Windows での MySQL インストール チュートリアル (画像とテキスト付き)

MySQL インストール手順 MySQL は、スウェーデンの MySQL AB によって開発された...

MySQL における識別子の大文字と小文字の区別の問題の詳細な分析

MySQL では、テーブル名の大文字と小文字の区別の問題が発生する可能性があります。実際、これはプラ...

Helloダイアログボックスのデザイン体験の共有

「どうしたの?」特定の種類のダイアログ ボックスに慣れていない限り、ダイアログ ボックスが表示された...

CentOS 7.6 Telnetサービス構築プロセス(Opensshアップグレードバトル第一弾のバックアップトランスポートライン構築)

不明な点があるときはいつでも、Blog Park にアクセスして、いつでも答えやインスピレーションを...

Vue3 手動カプセル化ポップアップ ボックス コンポーネント メッセージ メソッド

この記事では、ポップアップボックスコンポーネントメッセージのVue3手動カプセル化の具体的なコードを...

CocosCreator ユニバーサルフレームワークデザインネットワーク

目次序文Websocketの使用Websocketオブジェクトの構築Websocket ステータスW...

HTML の基礎_一般的なタグ、共通タグ、表

パート 1 HTML <html> -- 開始タグ<ヘッド>ウェブページ上の...

CSS による要素の中央揃えの原理の分析

CSS で要素の水平方向と垂直方向の中心を設定することは、非常に一般的な要件です。しかし、理論的には...