jQuery之after()insertAfteer()before()prepend().html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>jQuery之after()/insertAfteer()/before()/prepend()</title>
</head>
<body>
<script src="jQuery.js"></script>
<div id="divTwo">
  <p >这是divTwo</p>
</div>
<div id="divOne">
  <p>这是divOne</p>
</div>

<script>
  let divOne = document.querySelector("#divOne")
  let divTwo = document.querySelector("#divTwo")
//=========after()===========
// divOne.parentNode.insertBefore(divTwo, divOne.nextSibling)
// 上面的等价于
// $("#divOne").after($("#divTwo"))
// $("#divTwo").insertAfter($("#divOne"))
//=========prepend()===========
// $("#divTwo").prepend($("#divOne"))

// divTwo.insertBefore( divOne, divTwo.firstChild )
// =========before()===========
  $("#divTwo").before($("#divOne"))
// 上面的等价于
  divTwo.parentNode.insertBefore( divOne, divTwo );


</script>
</body>
</html>