1

同様の名前のdivにネストされたdivと同じidを持つ場合、ネストされたdivをidで参照するにはどうすればよいですか

例えば

<div id="obj1">
    <div id="Meta">
        <meta></meta>
    </div>
</div>

<div id="obj2">
    <div id="Meta">
        <meta></meta>
    </div>
</div>

metaのinnerHTMLを取得したい

document.getElementById('obj1').getElementById('Meta').getElementsByTagName('meta')

動作しません

4

7 に答える 7

24

ID は、SPAN、DIV など、ページにそのアイテムの 1 つがある場合にのみ使用する必要があります。CLASS は、繰り返し要素がある場合に使用する必要があるものです。

一意の ID で要素を参照しているが、ページに複数の要素があるため、そこのコードは機能しません。

于 2009-03-06T01:42:13.377 に答える
10

ID は一意である必要があります。

于 2009-03-06T01:39:51.900 に答える
7

明白なことを指摘するのは嫌いですが、あなたの例では、obj1_Meta と obj2_Meta は一意の ID であるため、作業コードに当てはまる場合:

document.getElementById('obj1_Meta').getElementsByTagName('meta')[0].innerHTML;

説明どおりに動作します。ダブルチェックとして、これを考えすぎましたか？

そうでない場合は、がっかり...

あなたのコードが「悪い」または「間違っている」のと同じように、機能するオプションは jQuery のような JavaScript フレームワークを使用することです。それを含めたら、次のように CSS セレクター (意味的に正しくないものでも) を渡すことで要素を取得できます。

$('#obj1 #obj1_Meta meta').html()

$() は jQuery の document.getElementById() の言い方です ... ステロイドについて。.html() は .innerHTML と同等です

PrototypeJS や MooTools などの他のフレームワークも同様の機能を提供します。

プロトタイプの例:

$$('#obj1 #obj1_Meta meta').innerHTML;//note the double $'s

フレームワークは、ブラウザーの互換性、JavaScript メソッド (getElementsByClassName など) の「欠落」、および AJAX の迅速なコーディングに関する多くの時間と手間を節約します。これらのことは、とにかく使用することをお勧めします。

于 2010-01-21T04:53:05.903 に答える
6

ID は一意であることを意図しており、クラスを賢く使用してください。

<div id="obj1" class="obj">
    <div id="obj1_Meta" class="obj_Meta">
        <meta></meta>
    </div>
</div>

<div id="obj2" class="obj">
    <div id="obj2_Meta" class="obj_Meta">
        <meta></meta>
    </div>
</div>
  • .obj= 両方の要素を対象とする
  • #obj1.obj= 最初のみを対象とする
  • #obj1.obj_Meta= 対象 obj1 内部 DIV
  • #obj2.obj= 2 番目のみを対象とする
  • #obj2.obj_Meta= 対象 obj2 内部 DIV
于 2010-01-21T05:06:24.653 に答える
5

「meta」タグは body タグではなく head タグ内でのみ有効であるため、このマークアップでも問題が発生する可能性があります。Firebug を見る限り、Firefox はこれらのメタ タグを body から引き出して head に投げ込みます (この場合、親 div 内にテキスト コンテンツを配置します)。そのため、DOM にはまったく表示されません。

于 2009-03-06T02:03:42.373 に答える
4

あなたが与えたHTMLの場合、これはうまくいくはずです：

document.getElementById('obj1').getElementsByTagName('div')[0].getElementsByTagName('meta');

内側の div の偽の ID を無視して、タグ名で取得してください。getElementsByTagName はサブツリー全体を検索するため、内側の div を完全に無視することもできます。

document.getElementById('obj1').getElementsByTagName('meta');
于 2009-03-06T03:03:06.677 に答える
3

id 属性はドキュメント全体の一意の識別子であるため、おそらく ID に名前空間を設定する必要があります。

<div id="obj1">
    <div id="obj1_Meta">
        <meta></meta>
    </div>
</div>

<div id="obj2">
    <div id="obj2_Meta">
        <meta></meta>
    </div>
</div>

document.getElementById('obj1_Meta').getElementsByTagName('meta')
于 2009-03-06T02:25:10.247 に答える