0

だから私は同じID'スティック'を持つ複数のdivを持っています。これらすべての要素を繰り返し処理し、それぞれにランダムな高さを与えたいと思います。これが私が試したものです：

    <script type="text/javascript">
        for(var i = 0; i < 47; i++) {
            var rand = 200;
            document.getElementsById('stick')[i].style.height= rand+'px';  
        }
    </script>

このコードは悲しいことに機能しません。私は何かが足りないのですか？

ありがとう。

4

3 に答える 3

5

複数の要素に同じ ID を追加しないでください。クラス名を使用します。Anddocument.getElemetsByIdは定義済みの関数ではなく、document.getElementById("s" なしで) 1 つの要素を返す必要があります。

HTML:

    <div class="stick"> </div>
    <div class="stick"> </div>

JS:

<script type="text/javascript">
    var divs = document.getElementsByClassName('stick');
    for(var i = 0; i < divs.length; i++) {
        var rand = 200 * Math.random();
        divs[i].style.height= rand+'px';  
    }
</script>

これはうまくいくかもしれません。ただし、JavaScript コーディングには jQuery フレームワークを使用することをお勧めします。これは、これらの行が jQuery ではより単純なコードになるためです。

<script type="text/javascript">
     $('.stick').each(function(){            //iterates all elements having stick class
         $(this).height(200 * Math.random());       //inside the callback the 'this' is the current html element. etc ...
     });
</script>

jQuery ホームページ: http://jquery.com/

あなたのウェブサイトにすばやくインクルードします。head 内の CDN URL から jQuery をインポートするだけです。

   <head>
       ...
       <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
   </head>
于 2013-03-09T09:11:52.077 に答える
0

ID はドキュメント内で完全に一意である必要があります。ID を一意の値に変更すると、個別に参照できます。要素のコレクションを操作したい場合は、classタグを使用してそれらをリンクします。詳細については、このドキュメントCSS Classesを参照してください。これは、HTML および CSS のクラスの目的を理解するのに役立ちます。

あなたの問題

getElementsByID()動作しません。getElementByID()正しい構文です。

そう

document.getElementsById('stick')[i].style.height= rand+'px';

となります

document.getElementById('stick')[i].style.height= rand+'px';
于 2013-03-09T09:11:43.450 に答える
0

同じ を持つ複数の要素を持つことはできませんid。一意idである必要があります。クラス名を使用して要素を使用および取得する必要があります。あなたを助けるためにjqueryを使うことができます：classvar elements = $('.stick')

于 2013-03-09T09:12:01.623 に答える