0

次のコードはエラーを生成するだけです。各DIVのREL属性値を取得したいと思います。わからない、なぜ私はそれをすることができないのか。

コンソールに表示されるエラー:Uncaught TypeError:Object#にはメソッド'getAttribute'がありません

    <div class="boxes">
        <div rel="first" class="box">Box 1</div>
        <div rel="second" class="box">Box 2</div>
        <div rel="third" class="box">Box 3</div>
    </div>
    <script>
        $(function(){
            var i = 0;
            var allDivs = document.getElementsByClassName('box');
            var arr = [];
            arr.push(allDivs);
            setInterval(function(){
                console.log(arr[i].getAttribute('rel'));
                i++;
            }, 1000);
        });
    </script>
4

2 に答える 2

1

配列 (正確には NodeList) を配列にプッシュし、個々の要素ではなく NodeList オブジェクトから属性を取得しようとしています。これを試して:

<div class="boxes">
    <div rel="first" class="box">Box 1</div>
    <div rel="second" class="box">Box 2</div>
    <div rel="third" class="box">Box 3</div>
</div>
<script>
    $(function(){
        var i = 0;
        var allDivs = document.getElementsByClassName('box');
        var arr = [];
        arr.push(allDivs);
        setInterval(function(){
            console.log(arr[0][i].getAttribute('rel'));
            i++;
        }, 1000);
    });
</script>

NodeList を他の配列にプッシュすることで、基本的にこれを作成します。

var arr = [[<div element 1>, <div element 2>, <div element 3>]];

おそらくやりたいことは、プッシュラインを次のように変更することです。

arr.push.apply(arr, allDivs);

これにより、 allDivs コレクション内のすべての個々の要素が に追加されarrます。arrその後、以前に期待したようにアクセスできます: arr[i].getAttribute('rel')(arrのコンテンツは になります[<div element 1>, <div element 2>, <div element 3>];)

于 2012-12-31T04:43:58.207 に答える
1

スクリプトを次のように置き換えます。

     $(function(){
        var i = 0;
        var allDivs = document.getElementsByClassName('box');
        //allDivs itself is an array and there is no need to push the result to an array.

        setInterval(function(){
            console.log(allDivs[i].getAttribute('rel'));
            i++;
        }, 1000);

     });
于 2012-12-31T05:12:07.557 に答える