JQuery--How to "create, modify, add" DOM elements first

How to one go the ground, on the fly to manipulate DOM elements?

For example, the "create", "Modify", "add" three actions are executed sequentially.

Since jquery supports chained operations, it is actually the builder mode of the design pattern, so we can string together three operations to execute.

First, you create a P element that contains a element of a.

$ (' <p><a>jQuery</a></p> ')

Then add an href attribute to the A element

$ (' <p><a>jQuery</a></p> ').find (' a '). attr (' href ', ' http://www.jquery.com ')

Finally add the newly added P element to the body

$ (' <p><a>jQuery</a></p> '). Find (' a '). attr (' href ', ' http://www.jquery.com '). End (). AppendTo (' body ')

Note that this place needs to perform an end () operation, otherwise the element added to the body is not a P element that becomes the a element in the P element.

In fact, the end () operation cannot be equivalent to undo, it returns previous selection, but the selection has been modified by the operation before the end.

<! DOCTYPE html>

Page code