Question

我循环遍历所有的grocery_items并获取其属性。但为什么杂货商品标签没有退货整个div里面，即：

<div class="column-right feedcontainer" id="protein"></div> 
<div class="column-left feedcontainer" id="sodium"></div>?

这是我的代码，HTML

 <div class="grocery_items" data-gs-height="4" data-gs-width="4" data-gs-x=
"10" data-gs-y="6">
    <div class="grocery_item_label">
        <div class="column-left feedcontainer" id="sodium"></div>
    </div>
</div>

<div class="grocery_items" data-gs-height="4" data-gs-width="4" data-gs-x=
"10" data-gs-y="6">
    <div class="grocery_item_label">
        <div class="column-right feedcontainer" id="protein"></div>
    </div>
</div>

Jquery的

$(function(){ 
var items =[];
$('.grocery_items').each(function () {
    var $this = $(this);
    items.push({
        x: $this.attr('data-gs-x'),
        y: $this.attr('data-gs-y'),
        w: $this.attr('data-gs-width'),
        h: $this.attr('data-gs-height'),


        content: $('.grocery-item_label', $this).html()

    });
   });

     alert(JSON.stringify(items));
      });

这是我的小提琴：http://jsfiddle.net/xu0ck30h/4/ 输出是这样的：

[{"x":"0","y":"12","w":"4","h":"4","content":"  <div id=\”Protein\" class=\"column-center feedcontainer\"></div>\n"},{"x":"4","y":"12","w":"4","h":"4","content":"  <div id=\”Sodium\" class=\"column-left feedcontainer\"></div>\n"},

Answer 1

您应该使用$($this).find('.grocery_item_label').html()代替。

$(function () {
    var items = [];
    $('.grocery_items').each(function () {
        var $this = $(this);
        items.push({
            x: $this.attr('data-gs-x'),
            y: $this.attr('data-gs-y'),
            w: $this.attr('data-gs-width'),
            h: $this.attr('data-gs-height'),
            content: $($this).find('.grocery_item_label').html()
        });
    });
    console.log(JSON.stringify(items));
});

选择器$('.grocery-item_label', $this)有点不清楚;你基本上是在告诉jQuery“用类.grocery-item_label选择每个元素，这个也是。”。

$($this).find('.grocery_item_label').html()将选择正在迭代的.grocery-item_label，然后尝试查找具有类grocery_item_label的子元素。另外，如果有多个孩子，使用.first()将帮助您找到第一个子元素。

此外，您的代码中存在拼写错误：$('.grocery-item_label')不应返回任何结果。

这是JSFiddle。

如何在div中返回整个div？

1 个答案: