首先在HTML中创建一个按钮和一个p元素来显示文本。然后在CSS中设置一个类来隐藏p元素:
Hello World!
.hide {
display: none;
}
接着,使用JavaScript创建一个函数来改变文本状态并设置一个3秒的时间间隔来使文本在一段时间后返回原来状态:
function changeText() {
var text = document.getElementById("myText");
var button = document.getElementById("myButton");
if (text.className == "hide") {
text.innerHTML = "你好世界!";
text.className = "";
button.innerHTML = "返回";
setTimeout(function() {
text.innerHTML = "Hello World!";
text.className = "hide";
button.innerHTML = "点击我";
}, 3000);
}
else {
text.innerHTML = "Hello World!";
text.className = "hide";
button.innerHTML = "点击我";
}
}
最后,在按钮上添加一个onclick事件来触发changeText函数:
Hello World!