All geek questions in one place

How to embed all <body> in the created new div with jQuery?

I want to wrap all the contents of Body in <div>, not including the tag <body>, details,

change DOM files from

<html>
    <body>i'm a body</body>
    <p>i'm out of body</p>
</html>

to (just put everything inside the body in one div)

<html>
    <body>
        <div id='bodyContainer'>
            i'm a body
        </div>
        <div id='footer'>
            i'm a footer
        </div>
    </body>
    <p>i'm out of body</p>
</html>

I tried to do this using jQuery

$(document).ready(function() {
    $("body").append("<div id='container'>I'm a body-container</div>");
    $("body").append("<div id='footer'>i'm testing!</div>");
});

but failed to change the DOM as

<html>
    <div id='bodyContainer'>
        <body>            
            i'm a body
        </body>
       <p>i'm out of body</p>
    </div>
    <div id='footer'>
        i'm a footer
    </div>
</html>

this is not what i want, see example http://jsfiddle.net/7szM4/2/ Thanks.

+3
source share
3 answers
$(function() {
    $('body').wrapInner('<div id="bodyContainer"/>');
    $('<div />',{id:"footer",text :"i'm a footer"})
        .insertAfter('#bodyContainer');
});

This should complete the task. Here is the demo : http://jsfiddle.net/DeNjE/

+1
source

try the following:

$(document).ready(function() {
    var b = $("body");
    b.text("");
    b.append("<div id='container'>I'm a body-container</div>");
    b.append("<div id='footer'>i'm testing!</div>");
});​

PS: - an error occurred in your script on jsFiddle. Put );in the end.

jsFiddle

+1
$(document).ready(function() { 
    $("body").html("<div id='container'>I'm a body container</div><div id='footer'>i'm testing</div>");
});

html() HTML .

0

Source: https://habr.com/ru/post/1760671/

More articles:


All Articles