8

HTML DOMに重複したIDを持つ要素がある場合、誰かがjavascript getElementById()の動作に光を当てることができますか??

4

5 に答える 5

12

標準的な動作は定義されていませんが、通常は最初に見つかった要素が返されます。

デモ: http://jsfiddle.net/ruNKK/

于 2012-07-17T18:38:04.800 に答える
9

同じIDの要素が複数ある場合は、それらをすべて選択できます

document.querySelectorAll("[id='myid']")

ただし、それを制御できる場合は、HTML のみを修正する必要があります。

于 2012-07-17T18:46:39.017 に答える
8

はい、動作は未定義です。

マークアップは無効であり、その状況でブラウザーが何をすべきかを定義する標準はありません。

各ブラウザは妥当なことをしようとし、通常は最初の要素を返します。それを処理できる他の可能な方法は、最後の要素を返すか、要素をまったく返さない (null)、またはエラーをスローすることです。

于 2012-07-17T18:49:16.457 に答える
4

同じIDを持つ複数のオブジェクトを持つことは違法です。許可されていないため、getElementById()複数の一致が存在する場合の動作は仕様で指定されていません。実際、仕様には、 「複数の要素がこのIDを持っている場合、動作は定義されていません」と明示的に記載されています。

私がこれを試したいくつかのブラウザでは、最初のブラウザが返されますが、明らかにそれに依存するべきではありません。

すべての一致を検索する場合は、すべてのタグのIDを調べて、一致するタグを収集するクエリを設計する必要があります。

プレーンなJavaScriptでは、次のように実行できます。

function getAllElementsById(id) {
    var all = document.getElementsByTagName("*");
    var results = [], elem;
    for (var i = 0; i < all.length; i++) {
        elem = all[i];
        if (elem.id && elem.id === id) {
            results.push(elem);
        }
    }
    return(results);
}
于 2012-07-17T18:44:54.950 に答える
1

はい。最初に戻ります。HTML 属性と同じ ID を使用することはできません
。 1. * view plaincopy to clipboardprint?

* {  
 margin: 0;  
 padding: 0;  
}

より高度なセレクターに移る前に、初心者向けに明らかなものをノックアウトしましょう。

星印は、ページ上のすべての要素を対象としています。多くの開発者は、このトリックを使用してマージンとパディングをゼロにします。これは確かに簡単なテストには問題ありませんが、本番コードでは決して使用しないことをお勧めします。ブラウザに負担がかかりすぎるため、不要です。

* は、子セレクターでも使用できます。プレーンコピーをクリップボードプリントに表示しますか?

#container * {  
 border: 1px solid black;  
}

これは、#container div の子であるすべての要素をターゲットにします。繰り返しますが、このテクニックをあまり使用しないようにしてください。

バツ

プレーンコピーをクリップボードプリントに表示しますか?

#container {  
   width: 960px;  
   margin: auto;  
}

ハッシュ記号をセレクターの前に付けると、ID でターゲットを設定できます。これは最も一般的な使用法ですが、ID セレクターを使用する場合は注意が必要です。

于 2012-07-17T18:43:09.503 に答える