The difference between three functions of jquery after append appendto

the description of the JQ documentation is1, after function definition and usage: the After () method inserts the specified content after the selected element. Syntax: $ (selector). After (content) instance:"Text/javascript"Src="/jquery/jquery.js"></script><script type="Text/javascript">$ (). Ready (function () {$ ("Button"). Click (function () {$ ("span"). After ("<a href="#">ddddd</a>")  })})</script>The results are as follows:<span>aaaaaaaaaaaaaaa</span><a href="#">ddddd</a>the span tag has one more a tag behind it.2, append function definition and usage: the Append () method inserts the specified content at the end of the selected element (still inside). Syntax: $ (selector). Append (content) instance:"Text/javascript"Src="/jquery/jquery.js"></script><script type="Text/javascript">$ (). Ready (function () {$ ("Button"). Click (function () {$ ("span"). Append ("<a href="#">ddddd</a>")  })})</script>The results are as follows:<span>aaaaaaaaaaaaaaa<a href="#">ddddd</a></span>more than one a tag inside the span tag3, AppendTo function definition and usage: the AppendTo () method inserts the specified content at the end of the selected element (still inside). Syntax: $ (content). AppendTo (Selector) Example:"Text/javascript"Src="/jquery/jquery.js"></script><script type="Text/javascript">$ (). Ready (function () {$ ("Button"). Click (function () {//$ ("span"). AppendTo ("<a href=" # ">ddddd</a>"), so the wording is incorrect$("<a href="#">ddddd</a>"). AppendTo ("span")  })})</script>The results are as follows:<span>aaaaaaaaaaaaaaa<a href="#">ddddd</a></span>the span tag has one more a-label effect and the Append function is the same, except that they are written in reverse. Note: The Before function is the opposite of the after function, which means that the element is preceded by the specified element

The difference between three functions of jquery after append appendto