javascript - 比较HTML文本内容和jQuery

我有一个页面，其中特定的div显示用户“系统角色”的ID，如下所示:

<div id="systemRoleIndicator" style="display: none;">
    <p>Z</p>
</div>

我可以使用jQuery检测到很好的值，但似乎无法将其实际用于任何事情。例如，我从未在以下代码中收到完成消息:

<script src="/scripts/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
    var role = $("#systemRoleIndicator").text();
    alert("Your role is: " + role); //displays proper value
    if (role == "Z") {
        alert("Code completed!");
    }
</script>

为什么会这样呢？我是否缺少有关比较字符串的内容？

最佳答案

#systemRoleIndicator的文本还将返回p节点附近的前导和尾随空格。它返回文本" Z "而不是"Z"。您需要与p元素的文本进行比较:

var role = $("#systemRoleIndicator p").text();

或修剪#systemRoleIndicator的文本内容:

var role = $("#systemRoleIndicator").text().trim();