Jquery 一种更干净的前置方式

Question

我最近做了一堵类似于 Facebook 的墙。

我只需要一些建议或更好的方法。

因此，当用户提交他的帖子时，我将结果添加到 div 中，并采用这种方式

$('.get_posts').prepend('<div id="'+stream.sid+'"class="row stream-posts"><div class="span1 stream-thumb"><ul class="thumbnails"><li><a href="#" class="thumbnail"><img src="http://placehold.it/60x60" alt=""></a></li></ul></div><div class="span5 stream-content"><a href="#" class="author">'+stream.author+'</a><p>'+stream.text+'</p></div></div>');

我知道这不是最好的，并且想询问更有经验的开发人员是否有更干净的方法来预先添加数据。

Answer 1

一个选项可以是创建一个 html 文档并使用 load()方法:

Load data from the server and place the returned HTML into the matched element.

标记.html:

    <div class="span1 stream-thumb">
      <ul class="thumbnails">
         <li>
           <a href="#" class="thumbnail"><img src="http://placehold.it/60x60" alt=""></a>
         </li>
      </ul>
     </div>
     <div class="span5 stream-content">
        <a href="#" class="author"></a>
        <p></p>
     </div>

$('.get_posts').prepend('<div id="'+stream.sid+'" class="row stream-posts"></div>');
$("#" + stream.sid).load('markup.html', function(){
   $(this).find('a:last').text(stream.author);
   $(this).find('p:last').text(stream.text)
})