从数据属性获取值并根据该值附加类

Getting value from data attribute and attaching class depending on that value

本文关键字:数据属性 获取      更新时间:2023-09-26

非常直接。试图从一些li的数据属性中获取值,根据这些值,我想分配一个隐藏或活动的类。这看起来很简单,但是如果我将console.log去掉布尔值,它将返回值。当使用布尔值时,它会在第一个(或最后一个)上挂起,并对所有元素应用.is-hidden。

<li data-sex="male"></li>
<li data-sex="male"></li>
<li data-sex="female"></li>
<li data-sex="female"></li>
<li data-sex="male"></li>
<li data-sex="male"></li>
<li data-sex="male"></li>
JS/JQuery

$('li').each(function() {
  sex = $(this).data('sex');
  console.log(sex);
  if(sex = "male") {
    $(this).addClass("is-active");
  } else {
    $(this).addClass("is-hidden");
  }
})

你需要===而不是=

if(sex === "male") {
    $(this).addClass("is-active");
} else {
    $(this).addClass("is-hidden");
}

你可以使用each和if条件直接添加class。

$('li[data-sex=male]').addClass("is-active");
$('li[data-sex=female]').addClass("is-hidden");

您需要使用=====代替=

if(sex == "male")

在应该使用比较操作符的情况下却使用了赋值操作符

if(sex = "male")
应该

if(sex == "male")

在比较两个值时需要

=====