0

以下代码只会产生错误。我希望检索每个 DIV 的 REL 属性值。不知道，为什么我做不到。

我在控制台中看到的错误：未捕获的类型错误：对象 # 没有方法“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 回答