javascript - 使用 dojo 更改 <div> 的 CSS 类

Question

我想根据 if 语句更改元素的 CSS 类。

这是我的:

HTML

<div data-dojo-attach-point="waitIcon" class="rightNode">

CSS

.rightNode{
  float: right;
  height: 75px;
  width: 60px;
  margin-top: 20px;
}
.noWaitIcon{
  float: right;
  height: 75px;
  width: 60px;
  margin-top: 34px;
}

JS

if (value == 0){
     domClass.remove(this.waitIcon, "rightNode");
     domClass.add(this.waitIcon, "noWaitIcon");
else{
     domClass.remove(this.waitIcon, "noWaitIcon");
     domClass.add(this.waitIcon, "rightNode");
}

Answer 1

data-dojo-attach-point 属性在您创建基于模板 的小部件时起作用。

this 很可能没有引用正确的对象。

总之这是一个jsfiddle有效的 dom 类。

require( [
    'dojo/dom',
    'dojo/dom-class',
    'dojo/domReady!'
], function(dom, domClass) {
    function swapColor(  ){

      if (value == 0){

        domClass.remove('node', 'red');
        domClass.add('node', 'green');
        value = 1;
      }
      else{

        domClass.remove('node', 'green');
        domClass.add('node', 'red');
        value = 0;
      }


    }
    value = 0;

    dom.byId("btn").onclick = swapColor;


});