随机替换x%字母的JavaScript函数
我需要一个JavaScript函数，它遍历属于特定类的页面的所有元素，并随机替换“X”个字符。其目的是在不同程度上模糊信息。信息越模糊，破译就越困难 我刚开始尝试使用getElementById创建一个元素，但由于行*s[I]=''_'；*，我已经被卡住了。除了替换特定字符的问题之外，我实际上还需要对属于特定类成员的每个段落执行该函数。。。不仅仅是一个id元素 编辑：我的方法有一个问题：像&；这样的特殊字符。然而，这对于我来说是一个小问题，我可以接受这一点来开始随机替换x%字母的JavaScript函数,javascript,Javascript,我需要一个JavaScript函数，它遍历属于特定类的页面的所有元素，并随机替换“X”个字符。其目的是在不同程度上模糊信息。信息越模糊，破译就越困难 我刚开始尝试使用getElementById创建一个元素，但由于行*s[I]=''_'；*，我已经被卡住了。除了替换特定字符的问题之外，我实际上还需要对属于特定类成员的每个段落执行该函数。。。不仅仅是一个id元素 编辑：我的方法有一个问题：像&；这样的特殊字符。然而，这对于我来说是一个小问题，我可以接受这一点来开始 <!DOCTYPE
<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript">
function obscure(percent){
var s = document.getElementById('change').innerHTML;
var i;
for(i=0; i<s.length;i++){
//return a random integer between 0 and 100
var rand = Math.floor(Math.random()*(percent+1)));
if(rand < percent){
s[i]='_';
}
}
document.getElementById('change').innerHTML = s;
}
</script>
</head>
<body>
<a onclick="obscure(50)">obscure</a>
<p id="change">
To be, or not to be: that is the question:
Whether 'tis nobler ...
</p>
</body>
</html>
函数模糊度（百分比）{
var s=document.getElementById（'change'）.innerHTML；
var i；
对于（i=0；i，因为将Math.random（）乘以percent+1，所以保证rand小于percent。因此，整个字符串都将是下划线
相反，将rand设置为：
var rand = Math.floor( Math.random() * 100 );
至于按类选择元素，我建议使用jQuery。它有一个很好的语法，可以使用CSS抓取元素。例如，你可以在jQuery中获得所有带有特定类的段落，如下所示：
for ( var paragraphToObscure in $( "p.someClass" )) {
// Do your obscuring code in here on paragraphToObscure...
}
其中，someClass是您在每个元素上查找的CSS类
您可以从这里下载jQuery JavaScript文件：函数（百分比）{
var s=document.getElementById（'change'）.innerHTML；
对于（变量i=0；i
您的字符串分配不起作用（您无法更改js字符串中的单个字符，因为在幕后它们是不可变的），并且您的条件也不准确（您希望创建一个1-100之间的随机数，以便将随机部分乘以100）
至于遍历某个类的所有元素，我建议您使用js库。我是一个jQuery的家伙，但还有很多！使用jQuery，您可以轻松地识别该类的所有元素：
$("#obscure50").click( function () {
var percent = 50;
$(".classToObscure").each( function () {
var s = $(this).html();
var i;
for(i=0; i<s.length;i++){
//return a random integer between 0 and 100
var rand = Math.floor(Math.random()*(percent+1)));
if(rand < percent){
s[i]='_';
}
}
$(this).html(s);
});
});
....
<a href="#" id="obscure50">obscure</a>
$（“#模糊50”）。单击（函数（）{
风险值百分比=50；
$（“.classToObscure”）。每个（函数（）{
var s=$（this.html（）；
var i；
对于（i=0；i您在Math.floor（）
行上还有一个额外的关闭parenthases。JavaScript错误控制台是您的朋友。下面是我的尝试，希望它能对类的所有元素都起作用。我不知道getElementByClassNames有多少支持，所以我还建议查看jQuery或其他库
我制作了另一个演示，向您展示了使用
看看这里
var百分比=50；
var auxed=document.getElementsByClassName（'auxed'）；
对于（i=0；i<0.length；i++）{
var元素=模糊[i]；
var text=element.innerHTML；
var str=“”；
对于（j=0；j
不破坏DOM-2&+事件的代码：
function obscure( element, percent ) {
if ( percent > 100 ) {
throw new Error( "percent can't be over 100!" );
}
// Prepare
var _ = "_",
alreadyChanged = [ ],
character,
i,
j,
innerText = "",
innerTextLength,
getTextNodes = function ( textNodes, textNodesLength, parentNode ) {
var index,
length,
node,
nodes = parentNode.childNodes,
nodeValue,
tagName,
i = nodes.length;
while ( i-- ) {
node = nodes[ i ];
if ( node.nodeType === 1 ) { // Element
tagName = node.tagName;
if ( tagName !== "SCRIPT" && tagName !== "NOSCRIPT" ) {
getTextNodes( textNodes, textNodesLength, node );
}
} else if ( node.nodeType === 3 ) { // Text
nodeValue = node.nodeValue;
if ( nodeValue.search( /\S/ ) !== -1 ) {
textNodes.push( node );
textNodesLength.push( nodeValue.length );
innerText += nodeValue;
}
}
}
},
max,
random = function ( max ) {
return Math.floor( Math.random( ) * ( max + 1 ) );
},
textNodes = [ ],
textNodesLength = [ ];
// Get all textNodes
getTextNodes( textNodes, textNodesLength, element );
innerTextLength = innerText.length;
// Get rid all all characters that are already the one we might change to
j = 0;
while ( ( i = innerText.indexOf( _, i + 1 ) ) !== -1 ) {
alreadyChanged[ i ] = true;
++j;
}
// Change the content
i = Math.round( ( percent / 100 ) * innerTextLength );
if ( i + j > innerTextLength ) {
i = innerTextLength - j;
}
max = innerTextLength - 1;
while ( i-- ) {
do {
j = random( max );
} while ( alreadyChanged[ j ] );
alreadyChanged[ j ] = true;
innerText = innerText.substring( 0, j - 1 ) + _ + innerText.substring( j );
}
// Replace textNodes' content
i = textNodes.length;
index = innerText.length;
while( i-- ) {
length = textNodesLength[ i ];
index -= length;
textNodes[ i ].nodeValue = innerText.substr( index, length );
}
}
// Example
obscure( document.body, 10 );
谢谢！关于JQuerry，它在我需要学习的事情列表中上升了。@xavier，这正是另一个讨论的主题。你可以做同样的事情而不打断它。@Xavierm你有关于它的链接吗？我刚刚花了10分钟写了这个：
var percent = 50;
var obscure = document.getElementsByClassName('obscure');
for (i = 0; i < obscure.length; i++) {
var element = obscure[i];
var text = element.innerHTML;
var str = "";
for (j = 0; j < text.length; j++) {
//return a random integer between 0 and 100
var rand = Math.floor(Math.random() * (100));
if (rand < percent) {
//Can't Change a String element directly
//https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String
str = str + '_';
} else {
str = str + text[j];
}
}
var x = str;
}
function obscure( element, percent ) {
if ( percent > 100 ) {
throw new Error( "percent can't be over 100!" );
}
// Prepare
var _ = "_",
alreadyChanged = [ ],
character,
i,
j,
innerText = "",
innerTextLength,
getTextNodes = function ( textNodes, textNodesLength, parentNode ) {
var index,
length,
node,
nodes = parentNode.childNodes,
nodeValue,
tagName,
i = nodes.length;
while ( i-- ) {
node = nodes[ i ];
if ( node.nodeType === 1 ) { // Element
tagName = node.tagName;
if ( tagName !== "SCRIPT" && tagName !== "NOSCRIPT" ) {
getTextNodes( textNodes, textNodesLength, node );
}
} else if ( node.nodeType === 3 ) { // Text
nodeValue = node.nodeValue;
if ( nodeValue.search( /\S/ ) !== -1 ) {
textNodes.push( node );
textNodesLength.push( nodeValue.length );
innerText += nodeValue;
}
}
}
},
max,
random = function ( max ) {
return Math.floor( Math.random( ) * ( max + 1 ) );
},
textNodes = [ ],
textNodesLength = [ ];
// Get all textNodes
getTextNodes( textNodes, textNodesLength, element );
innerTextLength = innerText.length;
// Get rid all all characters that are already the one we might change to
j = 0;
while ( ( i = innerText.indexOf( _, i + 1 ) ) !== -1 ) {
alreadyChanged[ i ] = true;
++j;
}
// Change the content
i = Math.round( ( percent / 100 ) * innerTextLength );
if ( i + j > innerTextLength ) {
i = innerTextLength - j;
}
max = innerTextLength - 1;
while ( i-- ) {
do {
j = random( max );
} while ( alreadyChanged[ j ] );
alreadyChanged[ j ] = true;
innerText = innerText.substring( 0, j - 1 ) + _ + innerText.substring( j );
}
// Replace textNodes' content
i = textNodes.length;
index = innerText.length;
while( i-- ) {
length = textNodesLength[ i ];
index -= length;
textNodes[ i ].nodeValue = innerText.substr( index, length );
}
}
// Example
obscure( document.body, 10 );