フロントエンド開発Blog

オレには鈍器がある

HTML , W3C , アクセシビリティ

かなり今さらな内容ですが備忘録として記録しておきます。

HTML内に同じIDを持つ要素があり、それをjQueryで取得する際、セレクタの記述方法でそれぞれ取得結果が変わります。結果が変わる=処理内容がことなる=処理にかかるコストも変わる ということでざっと計測してみました。ついでにマルチブラウザで確認した際に取得結果に違いが出るかどうかも検証しました。

  • PCのChrome、Firefox
  • Android4.2-5.1
  • ios8

まぁHTML作るときにIDを重複させるな、という話ですが、私が途中から(消火作業要員として)アサインされたお仕事のHTMLがアレな感じでどうしてもID重複を視野に入れたJSを書かざるを得なかったので調査ついでに検証しました。

ID重複はそもそもW3Cのバリデータでもエラーとして認識されますのでNG構造ですね。W3Cバリデータや、アクセシビリティチェックツールは必ず通すようにしていますが、他の作業員の方はそうではない方もいらっしゃるようですね。

「正しいHTML」はWEBアプリケーションにおいて必須項目だと思います。HTMLが正しくないと思わぬ動作不良を招きます。チェックツールで簡単に早期発見対処ができるので使用をおすすめしています。

参考サイト:HTMLチェック、アクセシビリティチェックツール

ページトップへ

関連ページ

ページトップへ