How to add child elements in jquery

Methods to add child elements: 1. Use the "$(parent element).append(child element)" statement; 2. Use the "$(parent element).prepend(child element)" statement; 3. Use the "$(child element).appendTo(parent element)" statement; 4. Use the "$(child element).prependTo(parent element)" statement.

The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.

jquery adds child elements

1, append method

Insert parameter content at the end of each matching element

Parameter type description:

1) Ordinary string (can contain various html tags)

$('body').append('html字符串');

2) jQuery object

① Use the $ function to create a new element (jQuery object)
② Use the $ function to get the existing element (jQuery object) on the page
At this time, the existing element will be The element is moved to the target element, that is, it is cut

<script type="text/javascript">
    $(function(){
            $getParagraph=$("p");//运行后p段落会变成div的子元素
            $("#oo").append($getParagraph);
        }
    );
</script>

<p>段落</p>
<div id="oo">div</div>

③ Use the clone method to clone an existing element (jQuery object) in the page

$getParagraph=$("p").clone();//这样就避免了p段落会变成p的子元素

3) html element object, html element Object array

==== Multiple parameters of the above types can be passed in, and each parameter will be inserted into the matching element! ===

4) How many matching elements does the function

have? How many times will this function be executed?

The function can accept two parameters: the first is the current The serial number of the element, the second one is the html in the current element

This inside the function represents the current html element object

The return data is the inserted content (can be an html element or jQuery object)

2. prepend method

Insert the parameter content into the front of each matching element

$(A).prepend(B)

$(A). prepend(B) means to insert B at the beginning of A.

3. appendTo method

Insert the matching element into the end of the target element (same as append)

$(A).appendTo(B)

$(A). appendTo(B) means inserting A into the end of B.

4. prependTo method

Insert the matching element into the front of the target element (same as prepend)

$(A).prependTo(B)

$(A). prependTo(B) means inserting A to the beginning inside B.

[Recommended learning: jQuery video tutorial, web front-end development video]

The above is the detailed content of How to add child elements in jquery. For more information, please follow other related articles on the PHP Chinese website!