英文:
How do you delete every single element from a page in JavaScript?
问题
以下是翻译好的部分：
我试图创建一个书签小工具，可以在一定时间后“炸毁”你的计算机。我已经拥有所需的一切，但我想在爆炸后删除页面上的所有内容，以便看起来它们已经被爆炸摧毁。这是我当前的代码：
javascript: (() => {
let rando = Math.floor(Math.random() * 10);
function explode() {
alert('BOOM!');
document.body.style.backgroundColor = 'red';
// 这里添加删除页面元素的代码
}
alert(`Your computer will explode in ${rando} seconds.`);
setTimeout(explode, rando * 1000);
})();
你需要在explode函数中添加删除页面元素的代码，以达到删除一切后将屏幕变为红色的效果。
英文:
I am trying to make a bookmarklet that "explodes" your computer after a set period of time. I have everything I need except that I want it to delete everything from the page so that it looks like they have been destroyed from the explosion. This is my current code:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
javascript: (() => {
let rando = Math.floor(Math.random() * 10);
function explode() {
alert('BOOM!');
document.body.style.backgroundColor = 'red';
}
alert(`Your computer will explode in ${rando} seconds.`);
setTimeout(explode, rando * 1000);
})();
<!-- end snippet -->
I want to delete all the elements from the page inside of the explode function so that it deletes everything then makes the screen red.
答案1
得分: 1
As Pointy 在评论中指出，您可以简单地使用以下代码来覆盖<body>标签中的所有内容：document.body.innerHTML = "";。此外，可能会出现rando被取整为0秒并且代码立即运行的情况，这可能不是您想要的，所以我建议使用Math.ceil()代替：
(() => {
let rando = Math.ceil(Math.random() * 10);
function explode() {
alert('BOOM!');
document.body.innerHTML = "";
document.body.style.backgroundColor = 'red';
}
alert(`Your computer will explode in ${rando} seconds.`);
setTimeout(explode, rando * 1000);
})();
因为您使用了 [tag:bookmarklet] 标签，以下是相同的代码作为一个书签：
javascript:(() => {
let rando = Math.floor(Math.random() * 10);
function explode() {
alert('BOOM!');
document.body.innerHTML = "";
document.body.style.backgroundColor = 'red';
}
alert(`Your computer will explode in ${rando} seconds.`);
setTimeout(explode, rando * 1000);
})();
英文:
As Pointy pointed out in the comments, you can simply overwrite everything in the <body> tag with document.body.innerHTML = "";. Also, it is possible that rando is floored to 0 seconds and the code runs immediately, which is probably not what you want, so I'd use Math.ceil() instead:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
(() => {
let rando = Math.ceil(Math.random() * 10);
function explode() {
alert('BOOM!');
document.body.innerHTML = "";
document.body.style.backgroundColor = 'red';
}
alert(`Your computer will explode in ${rando} seconds.`);
setTimeout(explode, rando * 1000);
})();
<!-- language: lang-html -->
<p>
test content
</p>
<!-- end snippet -->
Because you tagged your question with [tag:bookmarklet], here's the same code as a bookmarklet:
javascript:(()=>{let rando=Math.floor(Math.random()*10);function explode(){alert('BOOM!');document.body.innerHTML="";document.body.style.backgroundColor='red'}alert(`Your computer will explode in ${ rando } seconds.`);setTimeout(explode,rando*1000)})();
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论