JSLite - 노드 삽입 방법

궁금하신 점이 있으시면 이런 곳에서 소통하셔도 좋고, 공동개발을 위해 JSLite.io 조직팀에 합류하셔도 좋습니다!

prepend

는 태그 열기 태그(내부의 첫 번째 태그) 뒤에 삽입됩니다.
prepend(content) ⇒ selfprepend(Function) ⇒ selfprepend(content)  ⇒ selfprepend(Function)  ⇒ self

$("#box").prepend("dd") //⇒ self
$("#box").prepend(function(){
    return "asdfasdf"
}) //⇒ self

prependTo

将生成的内容插入到匹配的节点标签开始标记之后。这有点像prepend，但是是相反的方式。
prependTo(selector)   ⇒ self

$("<div>test</div>").prependTo("#box")

append

插入到标签结束标记前（里面的结尾）。
append(content)  ⇒ selfappend(Function)  ⇒ self

$("#box").append("dd") //⇒ self

$("#box").append(function(){
    return "asdfasdf"
}) //⇒ self

appendTo

将生成的内容插入到匹配的元素标签结束标记前（里面的最后）。这个有点像append，但是插入的目标与其相反。appendTo(selector)   ⇒ self

$("<div>test</div>").appendTo("#box")

after

插入到标签结束标记后。（兄弟节点的下面）
after(content)  ⇒ selfafter(Function)  ⇒ self

$("#box").after("dd") //⇒ self
$("#box").after(function(){
    return "asdfasdf"
}) //⇒ self

insertAfter

插入的对象集合中的元素到指定的每个元素后面的dom中。这个有点像 after ，但是使用方式相反。
insertAfter(selector)   ⇒ self

$("<p>test</p>").insertAfter("#box") //⇒ self
$("#input").insertAfter("#box")        //⇒ self  $("#input")

before

插入到标签开始前。
after(content)  ⇒ selfafter(Function)  ⇒ self

$("#box").before($("input")) //⇒ self
$("#box").before(function(){
    return "asdfasdf"
}) //⇒ self

insertBefore

将生成的内容插入 selector 匹配的节点标签开始前。这个有点像 before，但是使用方式相反。insertBefore(selector)   ⇒ self

$("<p>test</p>").insertBefore("#box")

unwrap

移除集合中每个元素的直接父节点，并把他们的子元素保留在原来的位置。 基本上，这种方法删除上一的祖先元素，同时保持DOM中的当前元素。replaceWith(content|fn)

$("p").unwrap() // ⇒ self

replaceWith

将所有匹配的元素替换成指定的HTML或DOM元素。
replaceWith(content|fn)

<div class="container">
  <div class="inner first">Hello</div>
  <div class="inner second">And</div>
  <div class="inner third">Goodbye</div>
</div>

    $(".third").replaceWith($(".first"));  // ⇒ 返回 “.third” 节点
上面的结果

<div class="container">
  <div class="inner second">And</div>
  <div class="inner first">Hello</div>
</div>

clone

clone()   ⇒ collection
通过深度克隆来复制集合中的所有元素。(通过原生 cloneNode

$("body").append($("#box").clone())