的Javascript比较HTML实体名称

Question

HTML

<button id="the_button" onclick="clicked()">&darr; Source &darr;</button> 

的Javascript

function clicked() { 
    if ($("#the_button").html() == "↓ Source ↓") { 
     alert($("#the_button").html()); 
    } 
} 

与上面的代码，我没有得到一个警报弹出...

但是，如果我将按钮文本和比较字符串更改为仅含有HTML实体的Source，则它可以工作：

HTML

<button id="the_button" onclick="clicked()">Source</button> 

的Javascript

function clicked() { 
    if ($("#the_button").html() == "Source") { 
     alert($("#the_button").html()); 
    } 
} 

有没有办法把它与HTML实体↓工作？

Answer 1

我相信JS看到的实体，而不是参考。尝试使用向下箭头的Unicode字符引用（\u2193）。

var $btn = $('#the_button'); 
 

 
$btn.on('click', function() { 
 

 
    var html = $btn.html(); // or .text() 
 
    
 
    if ('\u2193 Source \u2193' === html) { 
 
    \t alert(html); 
 
    } 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="the_button">&darr; Source &darr;</button>

有用的参考：Unicode Table（提供Unicode和HTML参考文献）。

Answer 2

这应该工作：

function clicked() { 
    if ($("#the_button").html() == '\u2193 Source \u2193') { 
     alert($("#the_button").html()); 
    } 
} 

Answer 3

您可以使用假元素藏汉

function clicked() { 
    if ($("#the_button").text() === $('<span>&darr; Source &darr;</span>').text()) { 
     // .... 
    } 
} 

Answer 4

见链接http://www.ascii-code.com/html-symbol.php知道该实体名称的ASCII码。 有关如何使用转义序列，请参阅https://mathiasbynens.be/notes/javascript-escapes的链接。

function clicked() { 
 
    if (document.getElementById("the_button").innerHTML == " \u2193 Source \u2193") { 
 
     alert(document.getElementById("the_button").innerHTML); 
 
    } 
 
}

<button id="the_button" onclick="clicked()"> &darr; Source &darr;</button>