JSはjQueryのappend関数を実装します

HTMLElement.prototype.appendHTML = function(html) {
	divTemp = document.createElement("div"); とします。
	ノードを null にします。
	フラグメントを document.createDocumentFragment() に格納します。
	divTemp.innerHTML = html;
	ノード = divTemp.childNodes;
	ノード.forEach(アイテム => {
		フラグメントに子要素を追加します(item.cloneNode(true))。
	})
	// 最後に追加
	this.appendChild(フラグメント);
	// 先頭に挿入
	// this.insertBefore(フラグメント、this.firstChild);
	ノード = null;
	フラグメント = null;
};

<スタイル>
。子供 {
  高さ: 50px;
  幅: 50px;
  背景: #66CCFF;
  下マージン: 1em;
}
</スタイル>

<div id="アプリ">
  <div class="child">
  <div class="child">
</div>

app = document.getElementById('app'); とします。
child を `<div class="child">down</div>` とします。
app.appendHTML(子);

var div2 = document.querySelector("#div2");
  div2.insertAdjacentHTML("beforebegin","<p>hello world</p>");//呼び出し要素の前に要素を追加しますdiv2.insertAdjacentHTML("afterbegin","<p>hello world</p>");//呼び出し要素内に子要素を追加し、最初の子要素を置き換えますdiv2.insertAdjacentHTML("beforeend","<p>hello world</p>");//呼び出し要素の後に子要素を追加し、最後の子要素を置き換えますdiv2.insertAdjacentHTML("afterend","<p>hello world</p>");//呼び出し要素の後に要素を追加します