检查 2 个变量是否包含完全相同的文本，并使用 jquery 执行操作

Question

我有下面的代码，我想检查两个变量"n"和"w"是否包含完全相同的文本并执行操作。但是我可以在变量中存储文本字符串，但是当我尝试设置条件时它不起作用？

我做错了什么？

var d = new Date();
var weekday = new Array(7);

weekday[0] = "Sunday";
weekday[1] = "Monday";
weekday[2] = "Wednesday";
weekday[3] = "Thirsday";
weekday[4] = "Πέμπτη";
weekday[5] = "Friday";
weekday[6] = "Saturday";
var n = weekday[d.getDay()];
var w =  $('.today-tag').text();


if(n === w) {
$('.today-tag').text('TODAY');
} else {
$('.today-tag').text('');
}

.today-tag {margin-left:10px;color:red;font-size:10px;font-weight:bold;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="the-day">Sunday<div class="today-tag"></div></div>
<div class="the-day">Monday<div class="today-tag"></div></div>
<div class="the-day">Tuesday<div class="today-tag"></div></div>
<div class="the-day">Wednesday<div class="today-tag"></div></div>
<div class="the-day">Thirsday<div class="today-tag"></div></div>
<div class="the-day">Friday<div class="today-tag"></div></div>
<div class="the-day">Saturday<div class="today-tag"></div></div>

Answer 1

类today-tag有很多div，所以$('.today-tag').text()不会返回你想要的值，你可以用each()来比较值

var d = new Date();
var weekday = new Array(7);

weekday[0] = "Sunday";
weekday[1] = "Monday";
weekday[2] = "Wednesday";
weekday[3] = "Thirsday";
weekday[4] = "Πέμπτη";
weekday[5] = "Friday";
weekday[6] = "Saturday";
var n = weekday[d.getDay()];
$(".today-tag").each(function(index,element){
if($.trim($(element).parent().text())== n){
$(element).text("Today");
}else{
$(element).empty();
}
});

.today-tag {margin-left:10px;color:red;font-size:10px;font-weight:bold;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="the-day">Sunday<div class="today-tag"></div></div>
<div class="the-day">Monday<div class="today-tag"></div></div>
<div class="the-day">Tuesday<div class="today-tag"></div></div>
<div class="the-day">Wednesday<div class="today-tag"></div></div>
<div class="the-day">Thirsday<div class="today-tag"></div></div>
<div class="the-day">Friday<div class="today-tag"></div></div>
<div class="the-day">Saturday<div class="today-tag"></div></div>

Answer 2

$('.today-tag').text()中什么都没有。您必须使用数组中当前日期的索引，parent()才能获取文本：

var d = new Date();
var weekday = new Array(7);
weekday[0] = "Sunday";
weekday[1] = "Monday";
weekday[2] = "Wednesday";
weekday[3] = "Thirsday";
weekday[4] = "Πέμπτη";
weekday[5] = "Friday";
weekday[6] = "Saturday";
var n = weekday[d.getDay()];
var idx = d.getDay();
var w =  $('.today-tag:eq('+idx+')').parent().text();
if(n === w) {
$('.today-tag:eq('+idx+')').text('TODAY');
} else {
$('.today-tag').text('');
}

.today-tag {margin-left:10px;color:red;font-size:10px;font-weight:bold;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="the-day">Sunday<div class="today-tag"></div></div>
<div class="the-day">Monday<div class="today-tag"></div></div>
<div class="the-day">Tuesday<div class="today-tag"></div></div>
<div class="the-day">Wednesday<div class="today-tag"></div></div>
<div class="the-day">Thirsday<div class="today-tag"></div></div>
<div class="the-day">Friday<div class="today-tag"></div></div>
<div class="the-day">Saturday<div class="today-tag"></div></div>

Answer 3

.today-tag是一个空的div元素，所以我们必须将其与.the-day进行比较 除此之外，$('.the-day'(将返回一个元素数组，因此我们需要使用date((对象也在那里。最后，我们只希望今天紧挨着当天，所以我们使用children((返回所选日期的子项数组。由于您只有一个子对象，因此我们使用第 0 个选项。

我希望这能很好地解释它。 (PS：我不是jquery专家，长期以来一直使用vanilla JS，因此可能有更好的替代kids((方法(

<script>
$(document).ready( function() {
var d = new Date();
var weekday = new Array(7);
weekday[0] = "Sunday";
weekday[1] = "Monday";
weekday[2] = "Wednesday";
weekday[3] = "Thirsday";
weekday[4] = "Πέμπτη";
weekday[5] = "Friday";
weekday[6] = "Saturday";
var n = weekday[d.getDay()];
var w =  $('.the-day')[d.getDay()];
var today = $(w).children()[0]; //selects first child
if(n === $(w).text()) {
$(today).text('TODAY');
} else {
$(today).text('');
}
});