Javascript无法显示/隐藏Dom元素(在Pannellum示例中)

时间:2018-04-05 08:02:35

标签: javascript dom pannellum

当我尝试使用javascript调用document.getElementById(elemId).style.visibility = visible / hidden。来尝试隐藏/显示DOM中的元素时,我遇到了问题。

这是一个非常奇怪的行为,当我通过id获取DOM元素并将可见性设置为可见时,在控制台中我可以看到内联样式已被修改但屏幕上的元素仍然被隐藏。

我会链接一个小问题的例子,希望有人可以提供帮助

这是我用来隐藏/显示DOM元素的功能

function updateHTML(elmId, value) {
  var elem = document.getElementById(elmId);
  if (typeof elem !== 'undefined' && elem !== null) {
    document.getElementById(elmId).style.visibility = value;
    console.log(elem);
  }
}

无论如何,即使是直接电话document.getElementById('2').style.visibility = 'visible'也无效

PS我想要实现的是显示感叹号的跨度,对于css默认,隐藏

Fiddle Demo

2 个答案:

答案 0 :(得分:1)

当您致电updateHtml时,尚未创建该元素。

进行测试在1秒后在超时调用中添加了updateHtml并且可以正常工作。

setTimeout(() => updateHTML("8", "visible"), 1000);

jsfiddle demo

答案 1 :(得分:0)

我检查了你的小提琴,但你提到的id以下代码不存在:

updateHTML("8", "visible");

在您的更新功能中执行此操作...

function updateHTML(elmId, value) {
  var elem = document.getElementById(elmId); // <- this line
  if (typeof elem !== 'undefined' && elem !== null) {
    document.getElementById(elmId).style.visibility = value;
    console.log(elem);
  }
}

但是你得到了现存元素的身份。

其他things

  

ID和NAME令牌必须以字母([A-Za-z])开头,可能是。{   后跟任意数量的字母,数字([0-9]),连字符(&#34; -&#34;),   下划线(&#34; _&#34;),冒号(&#34; :&#34;)和句号(&#34; .&#34; )。