Jquery obtains the outerHtml code containing the current node, jqueryouterhtml

Jquery obtains the outerHtml code containing the current node, jqueryouterhtml

In the development process, jquery.html () is to get the html code under the current node, does not contain the code of the current node itself, and sometimes we do need to find the jQuery api documentation and there is no way to get it.

We can see that some people pass through parent().html (). If the current element does not have a sibling element, it will not work if it does. Later, the experiment found that there is a jQuery method that can be solved, and it is very simple, as follows:

JQuery. prop ("outerHTML ");
Copy codeThe Code is as follows:
<Div class = "test"> <p> hello, hello! </P> </div>
<Script>
$ (". Test"). prop ("outerHTML ");
</Script>

The output result is: <div class = "test"> <P> hello, hello! </P> </div>

Because the native js dom has a built-in attribute outerHTML (case sensitive, JS is case sensitive) to get the html code of the current node (including the current node ), so we can get it using jQuery's prop (). The attr () method is not available after the experiment. If you don't believe it, you can try it. Thank you.

Of course, some people also use jQuery's clone () function with append () to create a node with only one child element and then get the node's html. This is also feasible, but the code is cumbersome.

How does Jquery (JS) obtain the HTML code of the current node?

You can consider using the outerHTML

Jquery does not obtain its own html.

Provide an idea and hope it will be useful to you.
<Div id = "div1">
</Div>
In this case, you can first obtain the img parent element and output the img