Question

我必须隐藏用户名的最后5个字符。以下是代码

<ul>
<li>
            </dl>
                <dl>
                <dt>Username:</dt>
                <dd id="up-d-username">AZRT435231
                </dd>
            </dl>
</li>
</ul>

我需要用“X”替换最后5个字符，因此输出应为AZRT4XXXXX。也可能是用户没有使用像firebug这样的工具从页面源看到这个名字？

Answer 1

"AZRT435231".slice(0, -5) + "XXXXX";

用户仍可以阅读原始页面来源。如果这很关键，请在服务器端语言到达客户端之前对其进行处理。

你可以制作一个更便携的版本......

var replaceLastNChars = function(str, replace, num) {
     return str.slice(0, -num) + Array(num + 1).join(replace);
};

结合它......

$("#up-d-username")
 .text(function(i, text) { return replaceLastNChars(text, "X", 5); });

没有jQuery，为了好玩......

var elem = document.getElementById("up-d-username").firstChild;

elem.data = replaceLastNChars(elem.data, "X", 5);

较新的浏览器......

var elem = document.querySelector("#up-d-username");

elem.textContent = replaceLastNChars(elem.textContent, "X", 5);

Answer 2

你可以这样做。

<强> Live Demo

txt = $.trim($('#up-d-username').text());
$('#up-d-username').text(txt.substring(0, txt.length - 5) + "XXXXX");

Answer 3

您应该使用服务器端语言隐藏它，以便用户无法使用调试工具查看它。

<?php
$username = "AZRT435231";
$output = substr($username, 0, -5) . "XXXXX";
?>
<ul>
<li>
            </dl>
                <dl>
                <dt>Username:</dt>
                <dd id="up-d-username"><?=$output?>
                </dd>
            </dl>
</li>
</ul>

Answer 4

另一种选择是使用正则表达式，然后用“X”字符替换匹配的字符串。

http://jsfiddle.net/uvDs8/

var re = /(.{1,5})$/;
var tester = "1234567890";

var new_value = tester.replace(re, function (matched) {
    return Array(matched.length+1).join("X");
});

alert(new_value);

在这种情况下，它只会替换尽可能多的（在字符串末尾最多5个）。因此，如果原始值只有4个字符长，则结果为4个“X”字符。如果结果是6个字符长，则结果是第一个字符加上5个“X”字符。等等。

Answer 5

vanilla JS的方法是：

 var name = document.getElementById('up-d-username');

 name.innerHTML = name.innerHTML.slice(0, -5) + "XXXXX";

使用jQuery，您可以按如下方式执行：

var $name = $('#up-d-username');

$name.html( $name.html().slice(0, -5) + "XXXXX" );

在替换发生之前，浏览器可以使用数据。如果有人只是简单地CURL URL，他们就可以访问这些信息。最好的办法是在将服务器端发送到浏览器之前将其替换为服务器端。

用x替换用户名中的最后5个字符

5 个答案: