HTML タグのカスタム属性に関する質問

HTML タグのカスタム属性に関する質問

以前の開発では、クラス、名前などの HTML のデフォルト属性を使用していました。 Huawei社のアウトソーシング会社に転職し、オープンソースフレームワークを使ったショッピングモールシステムを開発しました。コーディング中に、次のような状況に遭遇しました。 タグ内にカスタムタグが多数存在します。

コードをコピー
コードは次のとおりです。

<img msrc="<s:property value='#product.images'/>_m"
src="<s:property value='#product.images'/>_s" style="-ms-interpolation-mode:bicubic; cursor:pointer;"
onclick="queryProductDetail(this);"
infoType="<s:property value='#product.unitType'/>"
id="<s:property value='#product.unitID'/>"
moduleId="<s:property value='#product.unitID'/>"
chsDesc="<s:property value="#product.chsSimpleDesc"/>"
engDesc="<s:property value="#product.engSimpleDesc"/>"
chsName="<s:property value="#product.chsName"/>"
engName="<s:property value="#product.engName"/>"
onerror='checkImageFile(これ);'
onload="DrawImage(this,174,116)"/>

いくつかの点をまとめます。

1. HTML JS には影響はありません。複数の属性を記述できます。

2. 定義された属性の名前が元のデフォルト属性と同じでないことを確認します。

3. ブラウザはこのカスタム属性を解析しません

4. JS は xxx.getAttribute("あなたが書いた属性") を通じて値を取得できます。

この利点は明らかです。将来的にはこれをもっと頻繁に使用する必要があります。

<<:  Tomcat マルチレイヤーコンテナの設計に関する簡単な説明

>>:  MySql バッチに挿入するときにデータの重複を避ける方法

推薦する

Vue3.0 ルーティング自動インポート方法の例

1. 前提条件インポートには require.context メソッドを使用します。vite で作成...

MySQL UPDATE ステートメントの非標準実装コード

今日は、MySQL データベースと SQL 標準 (および他のデータベース) の UPDATE ステ...

JavaScript ファクトリーパターンの説明

目次シンプルファクトリーファクトリーメソッド安全な工場方法アブストラクトファクトリー要約するシンプル...

Node.js とブラウザのグローバル オブジェクトの違いの概要

Node.js では、.js ファイルは完全なスコープ (モジュール) です。したがって、var に...

JSは賞金の重さに基づいて当選確率を計算します

目次1. シナリオ例1.1. 抽選の賞品名を設定する1.2. 各賞の重みを設定する1.3. ラッキー...

Linux サーバー上のローカル静的リソースにアクセスするために nginx を使用する方法

1. ポート 80 が占有されているかどうかを確認します。通常、ポート 80 は Apache サー...

ulとliの基本的な使用法の分析

ナビゲーション、少量のデータテーブル、中央揃え<!DOCTYPE html PUBLIC &q...

HTML のテキストエリア タグ

<textarea></textarea> は、複数行を入力できるテキスト ...

HTML での非同期ファイルアップロードの例

コードをコピーコードは次のとおりです。 <form action="/hehe&qu...

Vueフロントエンドパッケージングの詳細なプロセス

目次1. パッケージ化コマンドを追加する2. パッケージ化されたコードを実行する3. パッケージ化し...

Linux オペレーティング システムでよく使用される MySQL コマンドの概要

以下に、一般的な MySQL コマンドをいくつか示します。 -- データベース サービスを開始します...

Javascript Bootstrapのグリッドシステム、ナビゲーションバー、カルーセルの詳細な説明

目次ブートストラップと関連コンテンツの紹介グリッドシステムネストされた列列オフセット列の並べ替えナビ...

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

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

Linux 継続的インテグレーションで Maven を自動的にインストールする方法

Mavenパッケージを解凍する tar xf apache-maven-3.5.4-bin.tar....

Axios を使用して Vue2 がリクエストを開始する詳細なプロセス記録

目次序文Axiosのインストールと設定シンプルなGETリクエストを開始するPOSTリクエストを行うシ...