HTML における if 判断の使用

HTML における if 判断の使用

Django Web開発の過程で、HTMLを書く際にバックエンドから同じ名前のリスト変数が渡されるが、内容の形式が異なるため別途判断する必要がある。多くの記事を参考にし、いくつかの方法を試したが、形式が間違っているようだ(体系的にフロントエンドを勉強したわけではなく、基本的にそのままコピーしただけ)
その後、Djangoフレームワークでhtml ifの使い方を見つけました

フォーマットはおおよそ次のとおりです

  <div class="if/else">
                    {% if フォーム名 == 'Callrecords' %}
                        通話記録
                    {% elif フォーム名 == 'ライドレコード' %}
                        ライドレコード
                    {% elif フォーム名 == 'クラブ情報' %}
                        クラブ情報
                    {% elif フォーム名 == 'クラブメンバー' %}
                        クラブメンバー
                    {% elif フォーム名 == '個人情報' %}
                        個人情報
                    {% 終了 %}
                    </div>

この構文は Django によって提供され、ネイティブ HTML コードの記述で使用されますが、役に立ちません。上記のコード ボックスでは HTML 形式が使用されていますが、<div> タグ間のコンテンツは HTML 言語でマークできないこともわかります。これは、組み込みの HTML 構文ではないことを示しています。
しかし、少なくとも私の Django プロジェクトでは問題なく使用できます。

要約する

上記はエディターが紹介した HTML での if 判断の使い方です。皆様のお役に立てれば幸いです。ご質問があればメッセージを残してください。エディターがすぐに返信いたします。

<<:  MySQLに挿入する前にデータが存在するかどうかを確認する方法

>>:  Vueデータ監視の原理の詳細な説明

推薦する

MySQL で explain ステートメントを使用する基本的なチュートリアル

目次1. 概要1. 説明文テスト2. 結果の各列の説明2. ID列の説明1. 環境整備2. expl...

JavaScript ウェブページ入門開発詳細説明

パート3: ❤バックエンドデータ受信を見落とす3つの方法❤ (おすすめ集)パート 2: Web フォ...

Vue における $router と $route の違いの詳細な説明

通常、vue プロジェクトではルーティングを使用します。vue-router は vue.js の公...

Zabbix の psk 暗号化と zabbix_get 値の組み合わせ

Zabbix バージョン 3.0 以降、Zabbix サーバー、Zabbix プロキシ、Zabbix...

MySQLクエリデータを時間別に表示します。データがない場合は0を入力してください。

需要背景統計インターフェースでは、フロントエンドは 2 つの配列を返す必要があります。1 つは 0 ...

TCPパフォーマンスチューニングの実装原理とプロセス分析

3ウェイハンドシェイクフェーズクライアントSYNパケットの再試行回数sysctl -w net.ip...

MySQL スロークエリログの有効化と設定

導入MySQL スロー クエリ ログは、問題のある SQL ステートメントのトラブルシューティングや...

INS と DEL を使用してドキュメントの変更をマークする方法の詳細な説明

ins と del は、HTML 4.0 で導入され、文書の作成時に作成者が共同作業できるようにし、...

数十行のjsを使用してクールなキャンバスインタラクティブ効果を実現する方法を教えます

目次1. 円を描く2. マウスで動かした円3. マウスでドラッグした粒子4. カラーグラデーション粒...

Linux のインスタンスにパブリック IP アドレスを割り当てる方法

説明するこのインターフェースを呼び出すときは、次の点に注意する必要があります。パブリック IP アド...

MySQL パフォーマンス最適化のための魔法のツール、Explain の基本的な使用分析

導入MySQL には、SELECT ステートメントを分析し、開発者が最適化できるように SELECT...

Vueの子コンポーネントと親コンポーネントの詳細な分析

目次1. 親コンポーネントと子コンポーネント2. テンプレート分離書き込み1. テンプレートタグ2....

vue+rem カスタムカルーセル効果

vue+remを使用したカスタムカルーセルチャートの実装は参考までに。具体的な内容は以下のとおりです...

Windows 10 での Hyperledger Fabric 1.4 環境構築プロセスの図

内容Hyperledger fabric1.4環境のWindows 10でのセットアップ前提条件Wi...

...