自己終了XHTMLタグを書くときに注意すべきこと

自己終了XHTMLタグを書くときに注意すべきこと

XHTMLの img タグは、次のように記述する必要があります: <img alt="" src="" />。この記述方法は自己終了とも呼ばれ、XML では完全に合法です。 XML 関連の開発に慣れている方であれば、XML 内の子ノードを持たない要素はすべてこの方法で記述でき、XHTML 内のコンテンツのないタグもすべてこの方法で記述できると考え、この記述方法に慣れているかもしれません。理論上、XHTML では任意のタグを自己終了形式で記述できますが、ブラウザの互換性によって新たな問題が発生しています。つまり、IE は特定のタグの自己終了形式の記述方法を正しく認識できません。 文字列 8
次の XHTML コードを入力して、IE で参照してみてください: <p>hello <script type="text/javascript" /> world</p>。先頭の hello しか表示されず、最後の world が表示されないことがわかります。これは本当に不可解です。皆さんの多くは、この問題に遭遇したことがあり、合理的な説明が見つからないまま何時間も費やしたことがあるかもしれません。 文字列 4
説明は、別の類似コードから得られます: <p>hello <textarea /> world</p>。IE での表示効果を確認することで、合理的な説明が得られますか?手前のhelloは正常に表示されていますが、奥のworldはtextareaに表示されていることがわかります。これは、IEがtextareaタグがそれ自体で閉じられていることを正しく認識しておらず、閉じられていないものとして扱い、次のコンテンツをtextarea内のコンテンツとして認識していることを証明しています。
これで、以前のコードがスクリプトの一部として認識されるため、その背後にある世界を認識できない理由がわかりました。これは、XHTML を使用する場合、XML ほど自由に自己終了の記述スタイルを使用できないことを示しています。自己終了の方法で記述できるのは、閉じる必要のないタグだけです。その他のタグについては、コンテンツがない場合でも、ペア終了の記述スタイルを使用するのが最適です。
最後に、実は愚かなパーサーは IE だけに見られるのではないということを皆さんに思い出していただきたいと思います。不正確なパーサーによって引き起こされる問題は、さまざまな場所で発生する可能性があります。したがって、XHTML を書くときは、古い HTML から受け継いだいくつかの習慣に適応する必要があります。本物の XML のように標準を満たしていると思って、気軽に書くことはできません。信じられませんか?もう一つ試してみましょう: <p>hello <br></br> world</p>、IE と Opera でどのように表示されるか確認します。
XHTML の関連仕様:
1. すべてのタグには対応する終了タグが必要です
2. すべてのタグ要素と属性の名前は小文字でなければなりません
3. すべてのXMLタグは適切にネストされている必要があります
4. すべての属性は引用符「」で囲む必要があります。
5. すべての<と&の特殊記号をエンコードする
6. すべての属性に値を割り当てる
7. コメントに「--」を使わない

<<:  Vue ソースコード学習でレスポンシブ性を実装する方法

>>:  Windows 10でDockerコンテナのポートにアクセスできない問題に対する完璧な解決策

推薦する

HTML+CSS をベースにした素敵なフリップログインおよび登録インターフェースを作成します

素敵なフリップログインと登録インターフェースを作成する序文最近、ネットワーク ディスクを構築しようと...

Linux Samba サーバーの超詳細なインストールと構成 (問題解決付き)

目次Samba サーバーの紹介Samba サーバー コンポーネントSamba サーバー関連の設定ファ...

PIP で docker-compose をインストールする際のタイムアウト問題の解決方法

1: インストールコマンドpip install docker-compose例外情報socket....

Vue3の一般的なAPIの使用方法の紹介

目次ライフサイクルの変化反応的な参照vue2.x では ref を使用して要素タグを取得します。vu...

MySQL 5.5 で範囲パーティションを追加および削除する例

導入RANGE パーティション分割は、指定された連続した間隔範囲に基づいています。RANGE の初期...

JSはアニメーションのレイアウト変換を実装します

JS でアニメーションを記述する場合、移動前に相対位置を絶対位置に変換してからアニメーション機能を実...

Bash スクリプトでの配列メソッドの作成と使用の概要

Bashで配列を定義するbash スクリプトで新しい配列を作成する方法は 2 つあります。 1 つ目...

Node.js での SerialPort モジュールの使用

目次目的モジュールのインストール基本的な使い方ポートをスキャンする開いているポートデータの送信データ...

docker run -v はデータボリュームを異常にマウントし、コンテナのステータスは常に再起動になります。

問題点: docker run に -v パラメータを追加すると、コンテナは常に再起動状態になります...

Vue の基本 MVVM、テンプレート構文、データバインディング

目次1. Vueの概要Vue公式サイトMVVM アーキテクチャ パターンVue の紹介2. Vueを...

Linuxのseqコマンドを使用して数字のシーケンスを生成します(推奨)

Linux の seq コマンドは、数字のリストを非常に高速に生成でき、使いやすく柔軟性に優れてい...

Vueコンポーネントのカスタムイベントの詳細な説明

目次要約する <テンプレート> <div> 要素 <h2>{{メ...

Nginx のステータス監視とログ分析の詳細な説明

1. Nginx ステータス監視Nginx には、Nginx の全体的なアクセス ステータスを監視す...

コマンドを使用してMySQLデータベース(de1)を作成する方法

1. MYSQLに接続するフォーマット: mysql -h ホストアドレス -u ユーザー名 -p ...

Docker のコンテナ データ ボリュームの概要

目次Dockerコンテナのデータ量データボリュームの使用方法1: コマンド-vを使用して直接マウント...