Web ページでカスタム HTML 属性を使用できるかどうか知っている人はいますか? ほとんどのモバイル デバイスでそれを読み取ることができますか? または、一部のデバイスはデフォルトの方法として属性を省略しますか? つまり、モバイル デバイスにインストールされているデフォルトの Web ブラウザのほとんどは、カスタム属性を処理できるのでしょうか?
次のようなコードがあります。
<input type="text" id="txt1" value="0" percent="50" idColor="12">
最近のブラウザは一般に、不明な属性を要素に割り当てられたプロパティとして扱い、デフォルトの影響はありませんが、CSS および JavaScript では属性として認識されます。たとえば、あなたの場合、CSS セレクターは属性を持つ要素にinput[idColor]一致しますが、そのような属性は HTML 仕様で定義されていません。inputidColor
ただし、JavaScript では通常、これらをプロパティとして直接利用することはできないため、ブラウザーの違いはありますが、たとえばdocument.getElementById('txt1').percentyieldになります。undefinedしかし、document.getElementById('txt1').getAttribute('percent')降伏し50ます。
Android でのみテストしましたが、これはモバイル ブラウザにも当てはまると思います。
ただし、HTML で独自の属性名を作成するのは安全ではありません。将来の HTML 仕様、または単に一部のブラウザが、 という属性に意味を割り当てたらどうなるpercentでしょうか? その意味は、私たちが今できるすべてのことに対して、非常に驚くべきものになる可能性があります.
したがって、クライアント側のスクリプトで使用する任意のデータを持つ属性を使用する場合は、 で始まる名前をdata-使用することをお勧めします。これにより、独自の名前空間で遊ぶことができます。合理的なブラウザや検索エンジンは、そのような属性をページ作成者の私的な遊び場以外のものとして扱い、めちゃくちゃにしないようにすることはありません。したがって、例を使用する方が良いでしょうdata-percent="50" data-color="12"。
あなたが話しているアイテムは属性です。Web ブラウザが特定の属性を理解できない場合、それらを無視する必要があります。