javascript - 如何使用 JavaScript(不是 jQuery)隐藏工具提示

Question

我使用此网站创建了我的工具提示:

http://www.w3schools.com/howto/howto_css_tooltip.asp

现在我想知道如何使用普通的 JavaScript 解决方案在任意时间后关闭工具提示。

到目前为止我的解决方案:

window.setTimeout(closeTooltips(), 700);

function closeTooltips(){
    document.getElementsByClassName('tooltipText').style.display="none";
}

我明白为什么这不起作用，但我看不到解决方案。我可以迭代 getElementsByClassName 返回的 NodeList 并隐藏每个单独的节点，但我觉得这可能不是一个理想的解决方案。

Answer 1

你很接近，但是setTimeout ，您并不是在尝试调用该函数，而是只是在尝试引用它，因此不要包含括号(这是 JavaScript 中的“调用运算符”):

setTimeout(closeTooltips, 700);

接下来，您需要迭代 DOM 查询找到的所有元素并单独设置它们的样式，如下所示:

function closeTooltips(){
    var elems = document.querySelectorAll('.tooltipText');

    elems.forEach(function(el){
      el.style.display = "none";
    });
}