Introduction and application of jquery element control (append element/append content)

First, append elements inside/outside the elementAppend,prepend: Adding to child elements
Before,after: Adding as a sibling element

Html:

<div id= "Content" >  add a piece of news to my back  

JS:

add elements to #content, this is to retire <p> Yao Ming ...</p> as a child element added to #content, if you want to append elements outside the element, you need to use after, so you can put <p> Yao Ming retired ...</p> as a sibling element appended to #content back.

ii. append content to different positions in the element

Html:

<div id= "Content1" style= "border:1px solid red" >  window front bright moon light  

Js:

Third, append content at the beginning of the element

Html:

<div> <div id= "Content" >  add a piece of news to my back  

DST

Iv. appending content at the beginning of different elements

Html:

<div id= "Content" >  add a piece of news to my back  

JS:

Add elements to the #content, this is the <span> is the ground frost </span> as a child element added to the beginning of #content, if you want to add a starting element outside the element, you need to use before, so you can put < Span> is the ground frost </span> as a sibling element appended to #content began

V. Elements containing elements with a specified structure

Warp (HTML)
Specifies an HTML element in the specified HTML, but the specified element cannot contain sibling elements, otherwise it does not run normally and does not contain a generic text string, and the following code contains the P tag with a div tag.

Html:

JS:

Vi. contains multiple HTML elements with the specified element

Wrapall (HTML)

Html:

<form id= "Form1" runat= "Server" > P content P content p content p content     

JS:

<script type= "Text/javascript" > JQuery (Function () {$ ("P"). Wrapall ("<div style= ' border:1px solid red ' >  

Seven, with the specified label contains child elements

Wrapinner (HTML)
As with the Warp method, you specify HTML elements in HTML, such as:
The code with the B tag containing the text in the P tag is as follows:

HTML:

JS:

Introduction and application of jquery element control (append element/append content)