您的位置：首页 > 其它

关于display:none;和id特性的一些需要注意的地方

2017-02-17 12:51 381 查看

关注点一：

　　display:none;一旦用于某个元素，那个这个元素在页面中就不再占据位置。

　　visibility:hidden;用于某个元素时，这个元素还会占据位置。

关注点二：

　　即使使用了display:none;只是在dom树中其不再显示了，但是，文件中还有这个元素（废话！）。

关注点三：

　我们知道一旦某一个元素拥有id特性，那么这个id名就会成为全局变量被调用，值得注意的是，这个id只能有一个！ 如果一个页面中有两个id，那么我们直接使用id名称并关联事件时，将不再生效（这时可以根据控制台的地址此时的button为undefined）。如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF8">
<title>获取验证码的倒计时</title>
<style>
.first_button{
display: none;
}
</style>
</head>
<body>
<button id="button" class="first_button">这是第一个</button>
<button id="button">这是第二个</button>
<script>
var button = document.getElementById("button");
console.log(button.className);
</script>
</body>
</html>

View Code

总结：如果页面比较复杂，尽量不要直接使用id作为全局变量来调用，以防止出错（即一个都获取不到）， document.getElementById还可以获取到一个呢！！

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航