web-dev-qa-db-ja.com

HTMLページで重複した「id」値を確認します

Webアプリケーションを開発していますが、HTMLページでid値の重複をチェックしたいと思います。ローカルマシンでアプリケーションを実行しています。

それを行う方法はありますか？

追伸：FirefoxとFirebugを使用しています。

htmlcssweb-developmentduplicate-content
5
user502052

W3Cの validator ツールは重複IDを報告します。コードをテストするには：

  1. 生成されたソースコードをクリップボードにコピーします。
  2. アクセス http://validator.w3.org/#validate_by_input
  3. マークアップをボックスに貼り付けて、[チェック]を押します。

必要に応じて、次のコードでテストできます。

<!doctype html>
<html>
    <head>
        <title>Test</title>
    </head>
    <body>
        <div id="test">Test div</div>
        <div id="test">Test div 2</div>
    </body>
</html>

これにより、次のエラーが生成されます。

enter image description here

7
Nick

  1. http://validator.w3.org/check

  2. Web Developer Toolbar がインストールされている場合、それを使用して、ブラウザーから直接上記のサービスにアクセスできます。ツール->ローカルHTMLの検証

  3. 一部の開発者ツール（PhpStorm/WebStormなど）は、このような検証を自動的に実行します。

3
LazyOne

W3C Validator を使用します。 IDが重複しているかどうかがわかります。
サイトがオンラインでない場合は、Operaを使用してください。彼らはそれを検証するためにページをアップロードする素晴らしい機能を持っています。

  • ページを右クリック
  • 検証

enter image description hereenter image description here

2
Alex

ブラウザのJavaScriptコンソールでこのコードを実行します–

(function findDuplicateIds() {
    var ids = {};
    var all = document.all || document.getElementsByTagName("*");
    for (var i = 0, l = all.length; i < l; i++) {
        var id = all[i].id;
        if (id) {
            if (ids[id]) {
                console.log("Duplicate id: #" + id);
            } else {
                ids[id] = 1;
            }
        }
    }
})();
2
Nanhe Kumar