jq 插入结构

一、插入

1. append

$("#div").append('<a href="baidu.com">a</a>') ;   // 末尾插入

2. appendTo

$('<a href="baidu.com">a</a>').appendTo($("#div"));  // 末尾插入

$('<div></div>', {
class: 'nstSlider',
'data-range_min': obj.range_min,
'data-range_max': obj.range_max,
}).appendTo(sliderWrap);

3.prepend

$("#content").prepend($('span')); 

4.prependTo

$("span").prependTo("#content");     /   $("span").prependTo($("#content"));   // 内容最前方插入指定内容 ，和搬砖一样，有砖是移动，没有就看存不存在可形成的实体，存在就添加，否则啥事不做。

5. before dom外层前方插入

 $("p").before("<p>Hello world!</p>");

6. after dom外层后方插入

$("p").after("<p>Hello world!</p>");

7.insertAfter 指定dom外层后方插入

$("<span>你好！</span>").insertAfter("p");

二、包裹

1. wrapInner

$("#div").wrapInner($("<a class='btn'></a>"));   //用 a 包裹住 #div 内容，即 内容加套

2. wrap

 $("p").wrap("<div style='border:1px solid red'><p></p></div>");   // 用此结构包裹 匹配的p ，内容及其dom均被裹住，即 外壳加套。

3.wrapAll

$("p").wrapAll("<div style='border:1px solid red'><p></p></div>");  // 创造一个包围圈，把所有匹配元素围起来，不匹配挤到外边，控制台筛选元素不错。。