Grab Body contents and wrap it within an element to show sort of like an iframe

StackOverflow https://stackoverflow.com/questions/18776222

  •  28-06-2022
  •  | 
  •  

Question

Ok, so I need all of the html within the body tag to be wrapped within a <div class="wrap" /> that lives within the body tag (deep within it). This code needs to run from within the <body> tag itself, so am thinking we'll need to append the code to the head or add it after the first <script> tag and run it from there.

I want it to basically output the entire body contents into the div with a class of wrap on that same page (within the body), with scrollbars as needed ofcourse, so overflow: auto; and will most likely need to use .wrapInner, but am not sure how to handle it completely. So it should than be inserted into the <div class="wrap" /> and will sort of mimic the idea of an iframe, but not exactly.

Was it helpful?

Solution

As you said you need to use .wrapInner()

jQuery(function(){
    $('body').wrapInner('<div class="wrap" />')
})

Demo: Fiddle

For your second question: would it be better to create the wrap element dynamically with code (from within the body), or have it be a part of the DOM from the start (from within the body)?

It will always be better if you change the markup than to modify the dom using script later

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top