1. After function definition and usage: After () method inserts the specified content after the selected element. Syntax: $ (selector). After (content) instance:
<script type= "Text/javascript" src= "/jquery/jquery.js" ></script>
<script type= "Text/javascript" >
$ (). Ready (function () {
$ ("button"). Click (function () {
$ ("span"). After ("<a href=" # ">ddddd</a>")
})
})
</script>
<body>
<span>aaaaaaaaaaaaaaa</span>
<button>after functions </button>
</body>
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 (
contentInstance
<script type= "Text/javascript" src= "/jquery/jquery.js" ></script>
<script type= "Text/javascript" >
$ (). Ready (function () {
$ ("button"). Click (function () {
$ ("span"). Append ("<a href=" # ">ddddd</a>")
})
})
</script>
<body>
<span>aaaaaaaaaaaaaaa</span>
<button>after functions </button>
</body>
The results are as follows:
<span>aaaaaaaaaaaaaaa<a href= "#" >ddddd</a></span>
More than one a tag inside the span tag
3. appendTo function definition and usage: the AppendTo () method inserts the specified content at the end of the selected element (still inside). Syntax: $ (
content). AppendTo (
selectorInstance
<script type= "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>
<body>
<span>aaaaaaaaaaaaaaa</span>
<button>after functions </button>
</body>
The results are as follows:
<span>aaaaaaaaaaaaaaa<a href= "#" >ddddd</a></span>
More than one a tag inside the span tag
The effect is the same as the APPEND function, except that they are written in the opposite way.
Note: The Before function, in contrast to the after function, indicates that the element is preceded by the specified element
jquery after append appendto three functions of the difference (GO)