Question

我正在努力编辑JS代码/ API（Google Feed）以使其在响应式设计中工作。

现在API的结果如下：

<div class="gfg-subtitle"></div>
<div class="gfg-list"></div>
<div class="gfg-subtitle"></div>
<div class="gfg-list"></div>
...

我希望它是这样的：

<div class="gfg-group">
    <div class="gfg-subtitle"></div>
    <div class="gfg-list"></div>
</div>
<div class="gfg-group">
    <div class="gfg-subtitle"></div>
    <div class="gfg-list"></div>
</div>

我尝试了这个（但没有得到任何结果）：

$(document).ready(function(){ $("#contentfeed").append("<div class='gfg-grouped'></div>");     
$(".gfg-grouped").text($(".gfg-subtitle").text() + " " +$(".gfg-list").text()); });

也试过这个（似乎也不起作用）：

var groupDiv = document.createElement('div');
groupDiv.className = 'gfg-group';
groupDiv.appendChild(newTitle);
groupDiv.appendChild(newList);

请参阅http://jsfiddle.net/pnwm67q8/2/：

Answer 1

感谢之前的回复，我继续自己解决了这个问题（我花了太长时间，但那是我们所有人都学得的正确吗？）如果能帮助某人，请将解决方案留在这里。

我添加了以下几行：

 var newGroup = this.createDiv_('gfg-grouped');

和

   if (!this.options.horizontal && this.options.stacked) {
        var newGroup = this.createDiv_('gfg-grouped');
        var newTitle = this.createDiv_('gfg-subtitle');
        nodes.root.appendChild(newGroup);
        newGroup.appendChild(newTitle);
        this.setTitle_(this.results[0].feed, newTitle);

和

  newGroup.appendChild(nodes.list);

请参阅：http://jsfiddle.net/m5krqvbz/3/

Answer 2

有很多逻辑，我不熟悉API，但你可以像这样对条目进行分组：

    // group the Title and List
    var groupDiv = document.createElement('div');
    groupDiv.className = 'gfg-grouped';
    groupDiv.appendChild(newTitle);
    groupDiv.appendChild(newList);

Answer 3

您将获得以下内容：

$intendedContainer = $("");
$(".gfg-subtitle").each(function(){
  var $list = $(this).next().detach();
  var $subitle = $(this).detach();

  var $groupItem = $("<div class='gfg-group'></div>");
  $groupItem.append($list).append($subtitle);
  $groupItem.insertBefore($subTitle);

  $intendedContainer.append($groupItem);
});

我没有完成整个代码，因为它非常庞大，但这是你需要实现的逻辑。

组API导致一个DIV

3 个答案: