的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>