3

ブラウザでHTMLの記述をチェックして問題があればアラートを表示するようなことは出来るでしょうか?

Webアプリケーションで動的にHTMLを生成する場合、バグで文法的に間違ったHTMLを生成してしまうことがあります。間違ったHTMLでもブラウザはエラーで停止したりせず、それなりに表示してくれるのですが、エラーにならないので開発者が間違いに気づかないことがあります。

静的なHTMLであれば、HTML向けのエディタで検証出来ますが、動的にHTMLを生成している箇所についてはエディタの検証機能ではカバーしきれません。(例えば、以下の snippet のような場合)

現在はHTML用のエディタや、W3Cのチェックツールに生成されたHTMLのソースをコピペして検証する、ということをやっているのですが、検証するパターンが多いと手間が大変なので、もう少し簡単に確認できる方法を探しています。

p { border: 1px solid red; }
<p>あいうえお
  <!-- ↓ ここから動的に生成-->
  <!-- pタグの入れ子はNGだが、なんとなく動いてしまう -->
  <p>
    かきくけこ
  </p>
  <!-- ↑ ここまで動的に生成 -->
</p>

2 件の回答 2

1

Google Chrome を使用しているのであれば validity という機能拡張はどうでしょうか

https://chrome.google.com/webstore/detail/validity/bbicmjjbohdfglopkidebfccilipgeif

設定によって特定のURLのページを開いときに自動でチェックしてくれます。

1
  • ありがとうございます。オプションのAutomatically Validate Hostslocalhostを入れておけばローカル実行時に常に自動でチェックできますね。とても便利です。
    – jirolabo
    Commented 2015年2月2日 12:57
1

W3C Markup Validatorはローカルにインストールして使用できるようです。

http://validator.w3.org/docs/install.html

または、HTMLをべた書きするタイプではないテンプレートライブラリを使う手もあります。HAMLのような。

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。