Jquery数组无法正常显示

Question

我有一个菜单，在点击菜单上我想根据我的菜单数据属性值过滤我的div 以下是我的代码示例

<li class="menu" data-cat="flower">
<li class="menu" data-cat="car">



<div class="item" data-item="lily"></div>
<div class="item" data-item="Audy"></div>
<div class="item" data-item="BMW"></div>
<div class="item" data-item="sunflower"></div>

jQuery：

$('.menu').on("click",function(e){
    var menu=$(this).attr("data-cat");
    /*
    console.log(menu) ; // displaying car
    var items=$('.item');
    for(var i; i<items.length;i++) {
        console.log(items[i].attr('data-items'))
        /*
        console.log(items[i].length) ----- > length not define
        console.log(items[i].data('item') ----- > data is not a function
        */ 
    }

console.log(items[i])上的

将显示<div class="item" data-item="BMW"></div>

Answer 1

在for循环中，items[i]是一个简单的javascript对象，为了使用data()函数你需要做什么，然后你需要将它转换为jQuery对象，就像这样$(items[i])。

$('.menu').on("click",function(e){
    var menu = $(this).attr("data-flower");
    var items = $('.item');
    for(var i; i < items.length; i++) {
        console.log( $(items[i]).data('item') );
    }
});