在追加项目之间插入空格

Question

我有一点问题，需要在 2 个帖子之间插入一个空格。

我的代码：

var news01 = $('#news01').empty();      
$.ajax({
    url: url,
    dataType: 'jsonp',
    jsonp: 'jsoncallback',
    timeout: 5000,
    success: function(data, status){
        $.each(data, function(i,item){ 
            var landmark = '</br><b> News</b></br>';            
            var landmark2 = '<h3>title</h3>';   
            var landmark3 = '<a href="#"  data-transition="pop"><img  src=""  style="width:100%"></a>';
            var landmark5 = '<div data-role="collapsible" data-collapsed-icon="arrow-d" data-expanded-icon="arrow-u" data-mini="true" data-collapsed="true"><h3>Leggi tutto...</h3><p>bla bla bla</p></div>';           
            var landmark4 = '<fieldset class="ui-grid-b"></div>';
            news01.append(landmark).trigger('updatelayout');
            news01.append(landmark2).trigger('updatelayout');   
            news01.append(landmark3).trigger('updatelayout');
            news01.append(landmark5).collapsibleset().trigger('updatelayout');
            news01.append(landmark4).trigger('updatelayout');   
        });
    },
    error: function(){
        news01.html ('<div><a class="ui-body ui-body-b ui-corner"><b>error</b></a></div>');
    }
});

和网页

   <div class="post">
   <div  id="news01"></div>
   </div>

这就是我想要的

谁能帮我）非常感谢

Answer 1

将其包装在 adiv 中

var landmark = '<div><b> News</b></br>';  

并添加

var landmark = '<div style="margin-bottom: 15px;"><b> News</b></br>';

只要记得再次关闭div

var landmark4 = '<fieldset class="ui-grid-b"></div></div>';

Answer 2

只需将html包装在div中并为其添加填充即可。

<div style="padding-bottom:10px">
    <h1>Heading</h1>
    <p>lorem ipsum</p>
</div>

您不必使用 5 个地标变量来附加 HTML。我想知道你为什么使用触发器，什么是更新布局？你可以这样做：

$('updatelayout').on('click',function(){
    $.ajax({
        url: url,
        dataType: 'jsonp',
        jsonp: 'jsoncallback',
        timeout: 5000,
        success: function(data, status){
        var landmark = '<div style="padding-bottom:10px;">';
            $.each(data, function(i,item){
                landmark = '</br><b> News</b></br>';            
                landmark += '<h3>title</h3>';   
                landmark += '<a href="#"  data-transition="pop"><img  src=""  style="width:100%"></a>';
                landmark += '<div data-role="collapsible" data-collapsed-icon="arrow-d" data-expanded-icon="arrow-u" data-mini="true" data-collapsed="true"><h3>Leggi tutto...</h3><p>bla bla bla</p></div>';           
                var landmark += '<fieldset class="ui-grid-b"></div>';
            });
            landmark = "</div>";
            $('#news01').html(element);
        },
        error: function(){
            news01.html ('<div><a class="ui-body ui-body-b ui-corner"><b>error</b></a></div>');
        }
    });
});