HTMLページの文字セットを指定する2つの方法

HTMLページの文字セットを指定する2つの方法

1. HTMLページの文字セットを指定する2つの方法

方法1:

<メタ文字セット="utf-8">

方法2:

<meta http-equiv="コンテンツタイプ" コンテンツ="text/html; charset=UTF-8">

上記は、ページの文字セットを UTF-8 に設定する (ページ文字セットの設定) 2 つの方法です。目的は、ブラウザに HTML ファイルの文字セットを伝えることです。

2. ページで使用する文字セットを設定する2つの方法

1 つ目は、サーバーが応答コンテンツの文字セットを指定することです。

レスポンス.setCharacterEncoding("utf-8")

前提条件: サーバーは、サーバーを介して指定されたインターフェースに転送またはリダイレクトします。

2 番目のタイプ: ページは文字セットを指定します。

1を参照

注: 最初の方法は 2 番目の方法よりも優先されます。

3. サーバー転送

このページでは文字セットがすでに設定されています

何が起こっているのでしょうか、なぜ機能しないのでしょうか?

原因分析

サーバー経由でページジャンプ要求(転送)を完了する

返却時に返却するデータの文字セットは指定されません。

f12 はネットワークをキャプチャし、対応するページの文字セットを iso-8859-1 として取得するため、ブラウザがページを解析すると文字化けした文字が表示されます。

解決

転送する場合は、返されるデータの文字セットを utf-8 として指定する必要があります。

レスポンス.setCharacterEncoding("utf-8");

サーバーリダイレクト

返されるデータのエンコーディング セットを指定せずにリダイレクトすると、ページはどうなりますか?

文字セットはページによって決定されます。つまり、ページの文字セットは、ページ内の文字セットの宣言によって決定されます。

たとえば、このページでは文字セット iso-8859-1 を指定しています。

ブラウザも iso-8859-1 に従って解析します。

さらに、リダイレクト設定がデータのエンコーディング セットを返す場合でも、リダイレクトによってデータが失われるため無効になります。

5. まとめ

ページがサーバーによって転送される場合、ページの文字セットは転送によって決定されます。それ以外の場合、リダイレクトされたインターフェイスまたは通常のインターフェイスの文字セットは、HTML ページ自体で宣言された文字セットによって決定されます。

注: 今日お話ししているのは、ページ文字セットの問題であり、純粋なデータ操作中に表示される文字化けした文字とは異なります。

また、HTTP レスポンス ヘッダーとメタの両方に文字セットが指定されている場合は、競合が発生し、http レスポンスの文字セットが有効になります。

以上がHTMLでページ文字セットを指定する2つの方法の詳細です。HTMLでページ文字セットを指定する方法の詳細については、123WORDPRESS.COMの他の関連記事に注目してください。

<<:  CSS 背景と境界タグの例の詳細な説明

>>:  CSSフィルターにはどんな魔法の用途があるか

推薦する

JavaScript が重複したネットワークリクエストを防ぐ方法の例

序文開発中は、インターフェース要求の繰り返しによってさまざまな問題が発生することがよくあります。ネッ...

HTML で 2 つの div タグの間に垂直線を描く方法

最近、インターフェースを描画しているときに、インターフェースに垂直線を描画し、この垂直線の高さが親 ...

JavaScript演算子の使用に関するヒントをいくつか共有します

目次1. オプションの連鎖演算子 [? .】 2. 論理的な空の代入 (?? =) 3. 論理和代入...

一般的な XHTML タグの紹介

<br />しばらくの間、多くの人が XHTML の使い方を知らないことに気付きました。...

SQLでEXPLAINコマンドを使用する方法

日常業務では、実行に時間のかかる SQL ステートメントを記録するために、スロー クエリを実行するこ...

JavaScript の Set データ構造の詳細な説明

目次1. セットとは何か2. セットコンストラクタ2.1) 配列2.2) 文字列2.3) 議論2.4...

訪問者を惹きつけるウェブサイトコンテンツを作成する14の方法

ネットサーフィンをしていると、私の注意を引こうとする美しいグラフィックでいっぱいの Web サイトを...

React Diff Principle の詳細な分析

目次差分アルゴリズムレイヤーごとの比較同じタイプのコンポーネントを比較する同じタイプの要素の比較子ノ...

動的なデジタル時計を実装するJavaScript

この記事では、JavaScriptで動的なデジタル時計を実装するための具体的なコードを参考までに紹介...

Alpine Dockerイメージフォント問題解決操作

1. フォントを実行し、フォント フォルダーを開いて、使用するフォント ファイルを見つけます。 2....

HTML と CSS を書くための 6 つの最も効果的な方法

この記事では、効率を向上させ、時間を節約することを願って、最も効果的な 6 つの方法を紹介します。 ...

win10にUbuntu18デュアルシステムをインストールするとmmx64.efiが見つからないという問題が発生する

Ubuntu 18のインストール中に、USBディスクからUbuntuのインストールを開始すると、mm...

本をめくる効果を実現するネイティブJS

この記事では、ネイティブ JS で実装された本をめくる効果の図を紹介します。効果は次のとおりです。 ...

Zabbixで監視する必要があるホストを追加するための詳細な手順

監視ホストの追加ホスト 192.168.179.104 が zabbix 監視項目に追加されます (...

Tomcat プロジェクトを展開する一般的な方法のいくつか [テスト済み]

1 / Webプロジェクトファイルをwebappsディレクトリに直接コピーするこれは最も一般的に使...