Differences between wrap () wrapAll () and wrapInner () in jQuery _ jquery-js tutorial

This article analyzes the differences between wrap () wrapAll () and wrapInner () in jQuery in combination with W3School documents, and provides a graphic comparison tutorial, which is very simple and practical, if you need it, you can refer to the method of reading a book tonight and find that jQuery has three package nodes. Baidu has jQuery wrap ()/wrapAll ()/wrapInner (), as a result, W3School ranked first in terms of documentation.

However, the W3School explanation is as follows:

JQuery document operations-wrap () method

The wrap () method places each selected element in the specified HTML content or element.
JQuery document operations-wrapAll () method

WrapAll () places all selected elements in the specified HTML content or element.
JQuery document operations-wrapInner () method

The wrapInner () method uses the specified HTML content or element to wrap all the content (inner HTML) of each selected element ).
I have read a few books and it is really annoying to see that such an explanation cannot solve my confusion immediately.

Or the most practical.

This is the original code for comparison:

I take the seat.

I take the seat.

Wrap () method

$ ("P"). wrap ("");

Result:

It can be seen that the strong tag contains each matching p tag.

WrapAll () method

$ ("P"). wrapAll ("");

Result:

We can see that the strong tag is surrounded by all the matching p tags.

WrapInner () method

$ ("P"). wrapInner ("");

Result:

We can see that the strong tag is embedded in each matching p tag.

Of course, in the end, it seems that the effects of the three methods are the same.

Click to stop.

The above is my personal analysis of the differences between wrap () wrapAll () and wrapInner () in jQuery. It is just my personal understanding. Please skip this step.