Remove body element_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-01-01 08:52 出处：网络

How to remove HTML <body> element with all of its content? var e = document.getElementsByTag(\'html\');

相关专题：javascript

How to remove HTML <body> element with all of its content?

var e = document.getElementsByTag('html');
开发者_开发百科e.removeChild('body');

Does not work.

The simple solution would be

 document.body.innerHTML = "";

But why on earth would you want to do this?

By the way:

 var e = document.getElementsByTag('html');

should be

 var e = document.getElementsByTagName('html')[0];

and

 e.removeChild('body');

should be

 e.removeChild(document.body);

getElementsByTagName returns a collection of nodes, not a single node
removeChild takes a node, not a string containing a tag name

    var e = document.body;
    e.parentNode.removeChild(e);

… however HTML documents require a body element, so this may have unexpected behavior.

...

document.body.parentNode.removeChild(document.body);

I think this will remove it

var html = document.getElementsByTagName('html')[0];
var body = document.getElementsByTagName('body')[0];
html.removeChild(body);

The body itself has a method which does just that:

document.body.remove();

document.body.parentNode.removeChild(document.body)

document.body = document.createElement("body")

while(document.body.childNodes.length != 0) {
  document.body.removeChild(document.body.childNodes[0])
}

Try this code it will remove all the content of body tag on click on the button
And if you want to remove content onload then use this onload="document.body.innerHTML = '';"

<html>
<body>
This is example Text<br>
<button onclick="document.body.innerHTML = '';">Click me to remove body contents</button>
</body>
</html>

Several people on this page have asked why one might even wish to remove a <body> element from an HTML Document.

Admittedly, it's a seldom-seen approach, but it's almost always because one wishes to remove the current <body> from a document (while keeping the <head>) and then create a new <body> element (to follow the same <head> as before).

So why not, simply empty the existing <body> element via:

document.body.innerHTML = '';

while (HTMLSourceTab.document.body.firstChild) {

  document.body.removeChild(document.body.firstChild);
}

The answer might be:

If the HTML Document in question is being opened in a new browser tab, these processes (above) can only execute after the DOMContentLoaded event fires.

And they may not execute quickly enough to prevent a brief Flash Of Legacy Body.

Whereas:

document.body.remove();

will normally execute quickly enough after DOMContentLoaded to prevent that flash.

Once the legacy <body> has been removed, a new <body> can be created and added via:

let newBody = document.createElement('body');
document.documentElement.appendChild(newBody);

or (if adding an empty <body>) simply:

document.body = document.createElement('body');

Full code for opening an existing document in a new tab, removing the existing <body> and adding a new <body>:

myNewTab = window.open(myNewTabURL, '_blank');

myNewTab.addEventListener('DOMContentLoaded', () => {

  myNewTab.document.body.remove();

  setTimeout(() => myNewTab.document.body = myNewTab.document.createElement('body'), 800);

});

myNewTab.focus();

Remove body element

精彩评论

关注公众号

热门标签

图文推荐

Remove body element

更多 问答 相关资讯：

精彩评论

关注公众号

热门标签

图文推荐

更多问答相关资讯：