处理标签的简单条件（JQuery，javascript）

debugcn 发表于 Dev

亚历克斯

我想写一个条件来处理标签。

$("#btn").click(function() {
  setInterval(function() {
    var number = 1 + Math.floor(Math.random() * 9 + Math.random() * 100);
    $('#div2').html(number);
    var $div3 = $("#div3");
    if (number > 50) {
      var span1 = $('<span />').addClass('yes').text('YES');
      span1.appendTo($div3);
      checkSpan(span1);
    } else {
      var span2 = $('<span />').addClass('no').text(' NO');
      span2.appendTo($div3);
    }
  }, 1000);
});

function checkSpan($span) {
  if ($span.prevUntil('.no', '.yes').length === 2) {
    [].forEach.call(document.querySelectorAll('.yes'), function(e) {
      e.parentNode.removeChild(e);
    });
    [].forEach.call(document.querySelectorAll('.no'), function(e) {
      e.parentNode.removeChild(e);
    });
    var Reset = $('<span />').addClass('reset').text("RESET");
    Reset.appendTo($("#div3"));
  }
}

.yes,
.no,
.reset {
  display: inline-block;
  padding: 5px;
  text-align: center;
  margin: 1px;
}

.yes {
  background-color: green;
  color: white;
}

.no {
  background-color: red;
}

.reset {
  background-color: #5f79ff;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="div1" style="background-color: #cce1ee;text-align: center;width: 500px;height: 500px;margin: 0 auto;">
  <input id="btn" value="click" type="button" style="' + 'text-align: center;width: 50px" />
  <div id="div2"></div>
  <div id="div3"></div>
</div>

在这里，我们之后（见3 YES）与类的所有跨度标签.yes，并.no会删除与此RESET创建。

现在我想要一个有条件的=>如果在RESET那之后YES呢？如是？因此，发出警告（“重置后，类别为yes的span标签”））否则{警报（“重置后没有类别为yes的span标签”）}

范例：

如果

<span class="reset">Reset</span>
<span class="yes">YES</span>

做东西 ....

法国式

如果我了解您想要什么：

$("#btn").click(function() {
  var nbyes = 0;
  setInterval(function() {
    var number = 1 + Math.floor(Math.random() * 9 + Math.random() * 100);
    $('#div2').html(number);
    var $div3 = $("#div3");
    if (number > 50) {
      if(nbyes == 3){
         nbyes = 0;
         alert("there is span tag with class yes after Reset");
      }
      var span1 = $('<span />').addClass('yes').text('YES');
      span1.appendTo($div3);
      nbyes++;
      if(nbyes == 3){
         checkSpan();
      }
    } else {
      if(nbyes == 3){
         nbyes = 0;
         alert("there is no span tag with class yes after Reset");
      }    
      var span2 = $('<span />').addClass('no').text(' NO');
      span2.appendTo($div3);
    }
  }, 1000);
});

function checkSpan($span) {
  $(".yes, .no").remove(); 
  var Reset = $('<span />').addClass('reset').text("RESET");
  Reset.appendTo($("#div3"));
}

.yes,
.no,
.reset {
  display: inline-block;
  padding: 5px;
  text-align: center;
  margin: 1px;
}

.yes {
  background-color: green;
  color: white;
}

.no {
  background-color: red;
}

.reset {
  background-color: #5f79ff;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="div1" style="background-color: #cce1ee;text-align: center;width: 500px;height: 500px;margin: 0 auto;">
  <input id="btn" value="click" type="button" style="' + 'text-align: center;width: 50px" />
  <div id="div2"></div>
  <div id="div3"></div>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。