Home > Developer > JavaScript
Analysis of append () and appendto () usage in jquery, jqueryappendto
This document analyzes the usage of append () and appendto () in jquery. Share it with you for your reference. The specific analysis is as follows:
In jQuery's document operation methods, the append () and appentto () Methods perform the same task, but there are also differences between the two.
1. append () method:Insert the specified content at the end of the selected element (but still inside the element.
A. Syntax:Copy codeThe Code is as follows: $ (selector). append (content); where the parameter content is required and the content to be appended is specified.
B. The append function can be used to add content to the selected element. Syntax:Copy codeThe Code is as follows: $ (selector). append (function (index, html); where function () is required and the index and html parameters are optional. Index indicates the index position of the receiving selector, and html indicates the current html of the receiving selector.
Example:
Copy codeThe Code is as follows: <Head>
<Script type = "text/javascript" src = "/jquery. js"> </script>
<Script type = "text/javascript">
$ (Document). ready (function (){
$ ("Button"). click (function (){
$ ("P"). append ("<B> Hello jQuery! </B> ");
});
});
</Script>
</Head>
<Body>
<P> This is a paragraph. </p>
<P> This is another paragraph. </p>
<Button> add content at the end of each p element </button>
</Body>
</Html>
The running result is as follows:
This is a paragraph. Hello jQuery!
This is another paragraph. Hello jQuery!
2. appendto () method:Insert the specified content at the end of the selected element (but still inside the element. However, functions cannot be used to Append content.
Syntax:Copy codeThe Code is as follows: $ (content). appendto (selector );
Example:
Copy codeThe Code is as follows: <Head>
<Script type = "text/javascript" src = "/jquery. js"> </script>
<Script type = "text/javascript">
$ (Document). ready (function (){
$ ("Button"). click (function (){
$ ("<B> Hello jQuery! </B> "). appendTo (" p ");
});
});
</Script>
</Head>
<Body>
<P> This is a paragraph. </p>
<P> This is another paragraph. </p>
<Button> add content at the end of each p element </button>
</Body>
</Html>
The running result is as follows:
This is a paragraph. Hello jQuery!
This is another paragraph. Hello jQuery!
I hope this article will help you with jQuery programming.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
