6

希望你能帮我解决这个问题......我的代码：

function showIt() {
  document.getElementById("gatewayContainerstacks_in_9_page4").style.visibility = "hidden";
}
setTimeout("showIt()", 2500); // after 2.5 sec

我想在 2.5 秒后隐藏一个 div。它工作正常，但问题是我想要定位的 div 是动态的。只有第一个词总是相同的（gatewayContainerstacks）。之后，ID 是动态的（_in_9_page4 部分）。有没有办法让代码搜索出以 gatewayContainerstacks 开头的 div？我会很感激一个提示..谢谢...

4

2 回答 2

9

将document.querySelector()与CSS 属性选择器^=结合使用，以匹配 ID 以所需前缀开头的元素：

function showIt() {
  document.querySelector('[id^="gatewayContainerstacks"]').style.visibility = "hidden";
}
setTimeout(showIt, 2500);

在这里，我还将函数showIt本身（而不是字符串）传递给setTimeout. 有关原因，请参阅MDN 。setTimeout

于 2013-08-24T18:42:31.003 回答
2

好吧，首先，你不应该将字符串传递给setTimeout. 在这种情况下，你可以通过showIt（没有括号！）它会工作得很好。

至于你的实际问题，你可以尝试这样的事情：

document.querySelector("[id^=gatewayContainerstacks]").style.visibility = "hidden";

但是请记住，这在版本 8 之前的 Internet Explorer 中不起作用，并且可能在某些较旧的移动浏览器中也不起作用。

对于更通用的解决方案，我建议提供一个唯一且已知的 ID，然后将其他信息放入data-*属性中：

<div id="gatewayContainerstacks" data-in="9" data-page="4">...</div>

或类似的东西。

于 2013-08-24T18:43:54.447 回答