JavaScriptのHTMLタグに任意の情報を保存しますか？

Question

非常に一般的な質問。

HTML / JavaScriptを使用して、複数レベルのタブに分割されるフォームを動的に生成しています。

CSSとbackground-imageを使用して、スター*記号で一部のフィールド（グローバルテンプレートとは異なる値を持つフィールド）を強調表示します。

JSフィールドは各フィールドを反復処理し、その値を比較し、必要に応じてCSSクラスを設定します。これまでのところ、とても良い。

さらに、変更されたすべてのフィールドにスターを付けるだけでなく、その中にある tab もマークしたいです。

シンプルだから、タブの要素IDを属性として各フィールドのHTMLタグ（＆quot; parentTab＆quot;のようなもの）のどこかに格納したいと思います。 JS関数は、フィールドとその「parentTab」を強調表示します;要素（および、おそらくその「parentTab」も）。

最初のアプローチは、「タイトル」を誤用することです。 parentTabを格納する属性またはsomethiong。もちろん、それは汚れています。しかし、DIVまたはINPUTタグに乱暴に任意の属性を追加しただけでは、それ以上検証されず、これらの属性へのアクセスが安全ではないと感じます。 / p>

だから私の質問は次のとおりです。JavaScriptでさらに処理するために、HTMLタグ内に任意のデータを保存するための有効な標準準拠の方法（ある種の属性）はありますか？

もちろん、「parentTabs」を作成できます。 JS配列とそれで行われます。ただし、入力自体に保存する方がはるかにエレガントです。

Answer 1

次のようにisChildOf関数を記述することにより、フィールドがどのタブ要素に属するかを見つけることができます。 http://jimkeller.blogspot.com/2008/07/jquery-ischildof-is-element-child-of.html

これを解決するためにDOMを使用すると、常に「優雅」になります。カスタム形式でデータを複製するよりも。

Answer 2

html5の導入により、 dataで始まる属性を使用できます- 、およびそれらはまだ検証します。

<input type="text" name="username" data-parentTab="tab1" value="non-default">

Answer 3

rel 属性は、多くの場合、このようなデータを保存するための有効な選択肢です。

Answer 4

jQueryには、問題に関するData APIがあります。 http://docs.jquery.com/Internals/jQuery.data

jQueryを使用しない場合は、独自のタグを追加して、そこに何かを保存できます。 誰もがこれは素晴らしいことなどではないと言うでしょうが、すべての素晴らしいウェブ企業はそうしています。あなたは素晴らしい会社になります;-）

Answer 5

John Resig がこれを行った方法が好きです。任意のタイプのスクリプトタグ。彼の例はテンプレート化についてですが、本当にこれを何にでも使うことができます。