javascript - 10秒后隐藏图片

有没有办法使用HTML和CSS在10秒后隐藏图像？如果不可能，是否有任何简单的方法可以仅使用JavaScipt(不是jQuery，除非有很高的要求，否则我不想将jQuery库添加到我的HTML页面中)。

最佳答案

要立即隐藏-

setTimeout(function() {
  document.getElementById('imageID').style.display='none'
}, 10*1000);

编辑:-使用纯JS动画隐藏

function start(){

window.timerID =  setInterval(function() {
var aOpaque = document.getElementById('imageID').style.opacity;
aOpaque = aOpaque-.1;

aOpaque = aOpaque.toFixed(1);

document.getElementById('imageID').style.opacity = aOpaque;

if(document.getElementById('imageID').style.opacity<=0)
clearInterval(window.timerID);
},1000);
}

window.onload = function(){start();}

在标记<image id="imageID" style="opacity:1">中，记住要给style="opacity:1"内联css属性。

请注意，由于<img>具有alt属性，该属性可能会影响页面的搜索结果，而执行display:none可能会对搜索结果产生不利影响，因此开发人员使用了-transform: translateX();之类的东西，只是将html标记置于 View 之外，即给出负值在translateX(value)中。