1

これは、私の JavaScript のonMouseOverDiv タグのイベント ハンドラーです。(少なくとも Chrome と IE では問題なく動作します):

function changeCallout(sender, e) {
    document.getElementById(sender.id).className = "callout2";
}

私ができるようにしたいのは、クラスが変更されている Div に含まれる H2 タグの color プロパティを設定することです。

color プロパティにアクセスするか、クラスを変更できる必要があることはわかっていますが、適切な H2 タグのみにアクセスする方法がわかりません (私は知っていgetElementsByTagNameます)。これを行う構文は何ですか？

4

3 に答える 3

2

はい、getElementsByTagNameでうまくいきますが、ネストされた要素も取得することを忘れないでください。たとえば、h2要素を持つdiv内にdivがある場合、それらも配列にダンプされます。

これがあなたの質問ではなかったことは知っていますが、コードで使用するために送信者要素のIDを取得する必要はありません。thisキーワードを引数として使用するだけで、要素が関数に渡されます。インラインhtml要素とeventListener呼び出しの両方で機能し、getElementByIdを使用する必要はありません。

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <style>
            div {width:100px;height:100px;background-color:#F00;}
            </style>
    </head>
    <body>

        <div onclick="onClick(this)">I'm a div</div>

        <script>
            function onClick(div) {
                alert(div.innerHTML);
            }
            </script>
    </body>
</html>
于 2011-12-11T01:40:19.357 に答える
2

h2必要なものが target の下の最初のものであると仮定するとdiv、次を使用してそれに対して相対的に検索しますdiv。

var div = document.getElementById(sender.id);
var h2 = div.getElementsByTagName("h2")[0];

それが最初のものでない場合は、目的のヘッダーの位置である(2 行目) に変更0するだけです。nn

于 2011-12-10T23:52:41.763 に答える
2

document.getElementById(sender.id).getElementsByTagName('h2')指定された ID を持つ要素内のすべての H2 要素の NodeList を返します。

于 2011-12-10T23:52:00.050 に答える