使用jQuery检查文本是否等于html特殊字符

我有一个html特殊字符，我想像复选框一样开关。在这种情况下，它是一颗星星：☆ 可以填写：★.

我想在单击星星时检查它的状态

$(".action_table_star").click(function() {
    if ($(this).html() == "★") {
        $(this).html("☆");
        $(this).css('color', 'white');
    } else {
        $(this).html("★");
        $(this).css('color', 'rgb(255,165,0)');
    }
});

---

但这不起作用，因为$（This）.html（）永远不等于“★”。我如何重写这个if语句来解码html特殊字符并检查其“状态”？

我的建议不是依赖于字符，而是依赖于添加和删除的类，如下所示：

$(".action_table_star").click(function(e) {
    if ($(this).hasClass("star-checked")) {
        $(this).css('color', 'rgb(255,165,0)').text("☆");
    }
    else {
        $(this).css('color', '#fff').text("★");
    };
    $(this).toggleClass("star-checked");
})

---

我的建议是不依赖于字符，而是添加和删除一个类，如下所示：

$(".action_table_star").click(function(e) {
    if ($(this).hasClass("star-checked")) {
        $(this).css('color', 'rgb(255,165,0)').text("☆");
    }
    else {
        $(this).css('color', '#fff').text("★");
    };
    $(this).toggleClass("star-checked");
})

这似乎有效

escape($(this).html()) == "%u2605"

其中

%u2605

是转义的填充星形符号。

这似乎有效

escape($(this).html()) == "%u2605"

---

其中

%u2605

是转义的填充星型符号。

请使用

.html（）

，而不是将

.text（）

与

\uxxx

序列结合使用，或者

使用

\uxxx

方法时，必须将base-10数字字符码转换为base-16字符码。示例（在控制台中）：

---

不要忘记填充足够的零以获得4位数字。

不要使用

.html（）

，而是将

.text（）

与

\uxxx

序列结合使用，或者

使用

\uxxx

方法时，必须将base-10数字字符码转换为base-16字符码。示例（在控制台中）：

不要忘记填充足够的零以获得4位数字。

不，

$（this）.html（）

永远不会等于

&9733，但它将等于★


不，
$（this）.html（）
永远不会等于
★，但它将等于★


您是否尝试过$（this）.text（）='★'
 您是否尝试过$（this）.text（）='★'
 改进SpYk3HH的建议，我会在文档中添加两颗星星，其中一颗显示为
display:none
，并使用jQuery在单击时切换这两颗星星

另外一个好处是，您现在可以使用CSS而不是jQuery单独设置每个星型的样式，这是它应该有的

HTML:


代码越少，越清晰，可读性越好。
改进SpYk3HH的建议，我会在文档中添加两个星星，其中一个显示为
显示：none
，并使用jQuery在单击时切换它们

另外一个好处是，您现在可以使用CSS而不是jQuery单独设置每个星型的样式，这是它应该有的

HTML:


代码更少，更清晰，可读性更好。
这是一个非常漂亮的解释。如果可以的话，我会投1票以上的赞成票。这是一个很好的解释。如果可以的话，我会投1票以上。
$(".action_table_star").click(function() {
    if ($(this).html() == "★") {
        $(this).html("☆");
        $(this).css('color', 'green');
    } else {
        $(this).html("★");
        $(this).css('color', 'rgb(255,165,0)');
    }
});

<div class="action_star">
  <span class="star1">&#9733;</span>
  <span style="display:none" class="star2">&#9734;</span>
</div>

$('.action_star').click(function() {
    $(this).find('.star1,.star2').toggle();
});