2

当我尝试使用 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默认值,隐藏

小提琴演示

4

2 回答 2

1

当您调用该元素时,updateHtml该元素尚未创建。

为了测试,在 1 秒后的超时调用中添加了 updateHtml 并且它可以工作。

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

jsfiddle 演示

于 2018-04-05T08:17:02.207 回答
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);
  }
}

但是你得到了不存在元素的 id。

其他事情

ID 和 NAME 标记必须以字母开头([A-Za-z]),后跟任意数量的字母、数字([0-9])、连字符 (" -")、下划线 (" _")、冒号 (" :") 和句点 (" .")。

于 2018-04-05T08:14:30.970 回答