js 判断是否有类名，在另外一个在增删类名

我是tab效果，当选中效果class="trol active"的时候，dot增加pitch类名
否则pitch消失。
选中状态class=“active”

原始：
<div class="dot">
   <span>1</span>
   <span>2</span>
   <span class="trol">3</span>
   <span>4</span>
</div>

效果：
<div class="dot pitch">
   <span>1</span>
   <span>2</span>
   <span class="trol active">3</span>
   <span>4</span>
</div>

<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
var int = self.setInterval("clock()", 1000);
function clock() {
    if ($(".trol").hasClass("active")) {
       $(".dot").addClass("pitch");
    }else{
      $(".dot").removeClass("pitch");
    }
}
</script>

这个问题我之前看到过很多次，都是你提问的吗，怎么一直在问这个

var trol = document.getElementByClassName('trol')[0]
var dot =  document.getElementByClassName('dot')[0]
if(trol.classList.indexOf("active")){
  dot.classList.add('pitch')
}else{
  dot.classList.remove('pitch')
}

如有帮助，麻烦点个【采纳此答案】

那不就是你选中的事件后再追加trol 的样式，用addClass就不可以了？

标签添加id
<span id = "myspan"class="trol active">3
自定义class
.myclass{
}
获取标签对象，并添加class
var myspan = document.getElementById("myspan");
myspan.className="myclass";

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div class="dot">
      <span class="active">A</span>
      <span>B</span>
      <span class="trol">C</span>
      <span>D</span>
    </div>
    <script src="https://cdn.staticfile.org/jquery/3.6.0/jquery.min.js"></script>
    <script>
      $('.dot').delegate('span', 'click', function(e) {
        $(this).addClass('active').siblings().removeClass('active')
        if ($(this).hasClass('trol')) {
          $('.dot').addClass('pitch')
        } else {
          $('.dot').removeClass('pitch')
        }
      })
    </script>
  </body>
</html>

你这个问题和你之前问的这个：

判断一个类名增加一个class-前端-CSDN问答 CSDN问答为您找到判断一个类名增加一个class相关问题答案，如果想了解更多关于判断一个类名增加一个class html、html5、javascript 技术问题等相关问答，请访问CSDN问答。

https://ask.csdn.net/questions/7593470?spm=1001.2014.3001.5505

这个问题是一样的，
代码稍微改下就可以了：

<div class="dot">

    <span>1</span>
 
    <span>2</span>
 
    <span class="trol">3</span>
 
    <span>4</span>
 
 </div>
 <script>
    var oDiv = document.querySelector(".dot");
    var lis = oDiv.getElementsByTagName("span");
    for(var i=0;i<lis.length;i++){
        lis[i].index = i;
        lis[i].onmouseover = function(){
            removeclass(this.index)
            if (this.getAttribute('class') .indexOf('trol') > -1) {
                   document.querySelector('.dot').classList.add("pitch");
            }
            else{
                document.querySelector('.dot').classList.remove("pitch");
            }
        }
    }
    function removeclass(index){
        for(var i=0;i<lis.length;i++){
            if(i==index){
                lis[i].classList.add("active");
            }
            else{
                lis[i].classList.remove("active");
            }
        }
    }
 </script>

选中trol后在它的父级增加类就可以了啊

基于问题，代码如下
window.onload = function() {
var trol = document.querySelector('.trol');
var dot = document.querySelector('.dot');
var span = document.querySelectorAll('.dot span');
for(var i = 0; i < span.length; i++) {
var item = span[i];
item.onclick = function() {
if(trol && trol.classList.indexOf("active") > -1){
dot.classList.add('pitch');
} else {
trol.classList.remove('active');
dot.classList.remove('pitch');
}
}
}
}

如有帮助采纳点赞