Jquery-微博发布案例

先来看一下页面布局：

 最外层是一个div包裹，然后是横着依次是span标签，textarea标签以及button按钮，下面是ul。这个布局比较简单就不多说了。

需要实现的功能：

1.点击发布按钮，动态创建一个li，放入文本框的内容和删除按钮，并添加到ul中

2.点击删除按钮可以删除当前微博留言

功能一实现思路：首先创造一个li，然后把文本框的内容给li，再创建一个删除链接，把内容和删除链接追加到ul中，最后让li滑动出来（只是为了效果好看），之后清空textarea里面的内容。代码如下：

 // 1.点击发布按钮，动态创建一个li，放入文本框的内容和删除按钮，并添加到ul中
            $(".btn").click(function() {
                    // 创建li
                    var li = $('<li></li>');
                    // 把文本框的内容给li
                    li.html($('.txt').val());
                    // 创建一个删除链接
                    var del = $('<a>删除</a>');
                    // 把内容和删除链接追加到ul中