The difference between jquery append of method and HTML of method and its usage

Append (content) : method inserts the specified content at the end of the selected element (still inside). Many friends think append is similar to HTML.

Definition and usage

The append() method inserts the specified content at the end of the selected element (still inside).
$(the selector). Append (content)

Use functions to attach content
Use the function to insert content at the end of the specified element.

grammar

$(the selector). Append (function (index, HTML))

Example code:

<script src="/jquery.min.js" type="text/javascript"></script> 
<style> 
.imgFocus{border: 1px solid #eee;} 
</style> 
<p> </p> 
<script type="text/javascript"> 
var showimg = "<div class='imgFocus'>123456</div>"; 
$("p").append(showimg); 
</script>

The HTML () method returns or sets the content of the selected element (inner HTML).

If the method does not set parameters, it returns the current contents of the selected element.
Return element content
When this method returns a value, it returns the contents of the first matched element.

grammar

$(the selector). The HTML ()

Set the contents of all p elements:

$(".btn1").click(function(){ 
$("p").html("Hello <b>world</b>!"); 
});

Specifies an empty element

$("a[href$='logout.asp']").click(function(event) { 
event.preventDefault(); 
$.get("/xxlr/Logout.asp","",function(data, textStatus) { 
if (data == 1) { //Indicating successful write-off
$('#message').html(""); 
$("#userlogin>div").show(); 
} 
else { 
$('#message').append("<p><strong> Logout failed , Please try again !</strong></p>"); 
} 
}); 
});

Here's what you can add:

Of course, append is append, HTML is full substitution
Such as < P id = "1" > < P> 123 < / p> < / p>
$(" # 1 "). The HTML (" < Span> 456 < / span>" );
The result: < P id = "1" > < Span> 456 < / span> < / p>

$(" # 1 "). Append (" < Span> < / span>" );
The result: < P id = "1" > < P> 123 < / p> < Span> 456 < / span> < / p>