How to work with ajax?

Friends, there's a problem..

Perhaps I'll start with the structure of the boilerplate Ajax calls query

$.ajax({ 
 url: window.location.href 
 cache: true, 
 success: function(html){ 
$("body").html(html);
 } 
});


The purpose of this request is to refresh the page after closing the modal window.
This approach works fine, but with a small exception:

5e9c19d7e31aa627031511.png

That is, duplicate styles, or to be more precise (not going to paint the shelves on standards of PSD to HTML, I think everyone knows): in the page body (<body>and</body>) loaded with the entire structure of the container <head></head>

Question: How to prevent it? Or maybe is there any other option?
April 19th 20 at 12:49
3 answers
April 19th 20 at 12:51
Solution
location.reload();
April 19th 20 at 12:53
$("body").html(html);
In the body you need to insert not the whole answer, but only the content of the tag <body> of the response
April 19th 20 at 12:55
Try one of these 2 options.

The first option:
$.ajax({ 
 url: window.location.href 
 cache: false, 
 success: function(html){
 var page = document.createElement('page'); // Create an empty element with the tag page
 page.innerHTML = html; // writes a server response
 var body = page.querySelector('body').innerHTML; // Read the contents of the body tag
 document.querySelector('body').innerHTML = body; // Writable sparency code to the page
 } 
});

The second option:
$.ajax({ 
 url: window.location.href 
 cache: false, 
 success: function(html){
 document.write(html); // Writable current document fully
 document.close(); // Close record
 } 
});

Find more questions by tags JavaScript