javascript 如何选择具有与值匹配的特定HTML内容的div

ua4mk5z4 于 2023-04-28 发布在 Java

关注(0)|答案(1)|浏览(85)

我创建了一个日历，显示的日期是用JavaScript循环生成的：

for (let i = 1; i <= lastDay; i++) {
    if (
        i === new Date().getDate() &&
            date.getMonth() === new Date().getMonth()
    ) {
        days += `<div class="today">${i}</div>`;
    } else {
        days += `<div>${i}</div>`;
    }
}

它给了我这个DOM结果：

<div class="days">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
  <div>6</div>
  <div>7</div>
  and so on...till 30 or 31, etc.
</div>

我从我的控制器中将存储库数据带到这个Twig模板中，它返回一些会话的日期。
所以我想知道我将如何能够读取所有这些div与JS包含一天的数字，并标记只有那些匹配的小枝日期（也日期号码，所以它匹配），等等在日历上，用户将能够看到每一天的情况下，他做了一个会话。
我想到了这样的东西：

for (i = 0; i < $(".days div").length; i++) {
    if($( "div" ).html() == {{ session.dayNumber }}) {
        $("div").addClass("marked");
    }
}

但我似乎不能让它工作得很好。
我成功地记录了所有的日子：

const monElement = document.querySelector('.days');

for (let i = 0; i < monElement.children.length; i++) {
    console.log(monElement.children[i].textContent);
}

JavaScript

来源：https://stackoverflow.com/questions/73660417/how-to-select-divs-that-has-a-specific-html-content-that-matches-a-value

1条答案

按热度按时间

but5z9lq1#

我不知道这是否是你想要的，但也许你可以把它作为一个开始。
因为我不知道当用户访问页面时如何存储days，所以我使用了一个'days'数组，并比较当前的day from循环是否等于day from visited。..

const visited = [2, 5, 8] // i am not sure how you will store the visited days..
const monElement = document.querySelector('.days')

for (let i = 0; i < monElement.children.length; i++) { // iterate through all elements
  let day = monElement.children[i].textContent;

  for (let v of visited) { // iterate through visited

    if (v == day) {
      monElement.children[i].innerHTML += ' - visited';
      monElement.children[i].classList.add("marked");
    }
  }

}

.days {
  width: 100px;
}

.marked {
  background-color: yellow;
}

<div class="days">
  <div> 1 </div>
  <div> 2 </div>
  <div> 3 </div>
  <div> 4 </div>
  <div> 5 </div>
  <div> 6 </div>
  <div> 7 </div>
  <div> 8 </div>
  <div> 9 </div>
  <div> 10 </div>
</div>

赞(0）回复(0）举报 2023-04-28

我来回答

javascript 如何选择具有与值匹配的特定HTML内容的div

1条答案

相关问题

热门标签

最新问答