使用setAttribute()修改display属性的坑

来源:互联网 发布:网络改造设备 编辑:程序博客网 时间:2024/06/05 14:46

今天在慕课网学习的时候遇到一个问题。


有这样一个盒子:

<html><head><style>#login_box{width:300px;height:150px;background:#eee;position:absolute;left:50%;top:50%;margin-left:-150px;margin-top:-75px;display:none;}</style></head><body><div id="login_box"><p>用户登录</p></div></body></html>

根据任务要求,我需要让这个盒子显示在屏幕上。


但是以下代码没有效果:

<script>var box = getElementById("login_box");box.setAttribute("display","block");</script>


搜索之后发现有人遇到了同样的问题,解答如下:


也就是说,“display”不是一个HTML属性,是一个CSS属性,如果要用setAttribute方法修改的话,代码如下:

box.setAttribute("style","display:block");

但是不建议采用这种方法。

推荐使用:

box.style.display = "block";



原创粉丝点击