jQuery中添加与删除元素

我们可以使用jQuery方便的添加或删除元素。

1、使用jQuery生成新元素，生成新元素的方法，比如，我要生成一个有序列表的标签，只需要：

var ol = $('<ol></ol>');

即可

2、append()方法：

在元素的的内容后面添加元素

我们可以使用jQuery来添加元素，上面的例子中只有一个ol标签肯定是不行的，还需要给里面添加li标签，这时候就可以使用：

        ol.append($('<li>瓦尔登湖</li>'));

        ol.append($('<li>小王子</li>'));

        ol.append($('<li>西游记</li>'));

3、prepend() 方法：

在被选元素的内容前面添加元素：

现在又有一个新的需求，需要给ol标签的最前面添加一行列表，就可以使用prepend()方法：

        ol.prepend($('<li>水浒传</li>'));

4、before()方法：

在被选元素之前添加元素：

比如有一个img标签，要在img标签的前面添加一个p标签：

var p1 = $('<p>前面的段落</p>');

$("#img1").before(p1);

5、after()方法：

在被选元素之后添加元素：

同样的道理，在img标签的后面添加一个p标签：

var p2 = $('<p>后面的段落</p>');

$("#img1").after(p2);

6、删除HTML中的元素：

remove():

remove方法可以删除HTML中的元素，比如我想删除ol中的某一li标签，其添加的代码为：

var ol = $('<ol id="books"></ol>');

ol.append($('<li id="book2">瓦尔登湖</li>'));

ol.append($('<li>小王子</li>'));

那么删除id为book2的li的方法为：

$("#book2").remove();

7、清空元素：

empty()：

empty方法可以清空HTML元素中的所有元素，比如清空ol中所有的元素：

 $("#books").empty();