添加元素

jQuery提供了添加元素的方法，用来为目标元素添加某个元素。添加的方式有两种，分别是内部添加和外部添加，下面分别进行讲解。

1. 内部添加

内部添加的方式可以实现在元素内部添加元素，并且可以放到内部的最后面或者最前面。内部添加主要通过append()和prepend()方法来实现，下面通过代码进行演示。

 1  var li = $("<li>我是后来创建的li</li>");
 2  $("ul").append(li);    // 内部添加并且放到内部的最后面
 3  $("ul").prepend(li);    // 内部添加并且放到内部的最前面

上述代码中，通过$("ul")获取到页面中的ul元素，并调用append(li)将li元素添加到ul中。append()是把元素添加到匹配元素内部的最后面，而prepend()是把元素添加到匹配元素内部的最前面。

2. 外部添加

外部添加就是把元素放入目标元素的后面或者前面，通过after()和before()方法来实现。下面通过代码进行演示。

 1  var div = $("<div>我是后来创建的div</div>");
 2  $(".test").after(div);   // div放入到目标元素的后面
 3  $(".test").before(div);  // div放入到目标元素的前面

上述代码中，在类名为“test”的元素后面和前面分别插入div元素。其中after()表示在目标元素的后面插入div元素，而before()表示在目标元素的前面插入div元素。