Question

如果在使用if语句的javascript中某个条件为真，我想显示此灯。如何在javascript if语句中添加外部CSS类？

这是我的css代码：

.beacon{
  position:absolute;

  background-color:#32CD32;
  height:1.5em;
  width:1.5em;
  border-radius:50%;
  -webkit-transform:translateX(-50%) translateY(-50%);
}
.beacon:before{
  position:absolute;
  content:"";
  height:1.5em;
  width:1.5em;
  left:0;
  top:0;
  background-color:transparent;
  border-radius:50%;
  box-shadow:0px 0px 2px 2px #32CD32;
  -webkit-animation:active 2s infinite linear;
  animation:active 2s infinite linear;
}

@-webkit-keyframes active{
  0%{
    -webkit-transform:scale(.1);
    opacity:1;
  }
  70%{
    -webkit-transform:scale(2.5);
    opacity:0;
  }
  100%{
    opacity:0;
  }
}

@keyframes active{
  0%{
    transform:scale(.1);
    opacity:1;
  }
  70%{
    transform:scale(2.5);
    opacity:0;
  }
  100%{
    opacity:0;
  }
}

这是javascript代码：

<div class="too white">
<script language="javascript"> 
url = "http://www.511virginia.org/"
ping = new XMLHttpRequest();   
ping.onreadystatechange = function(){
    if(ping.readyState == 4){ 
                if(ping.status == 200){
          document.write("Website is up");
        }
                else {
                  document.write("Website is down"); 
                                }
}
}
ping.open("GET", url, false);   
ping.send();
</script>
</div>

Answer 1

这取决于您使用的任何框架。例如，如果您正在使用jQuery，则使用.css(property, value)更改DOM元素的CSS。 Angular有它自己的方法。对于原始DOM操作，请查看JavaScript HTML DOM - Changing CSS上的w3c页面，其中显示以下内容。

document.getElementById(id).style.property = new style

添加灯到javascript w / ping测试

1 个答案: