Question

我试图弄清楚如何在一个数组中用多个字符串中的随机数替换数字/字母排列的实例，同时还在每次点击时随机生成其中一个字符串。

基本上，我想在点击时从我的阵列中随机生成我的一个字符串，并替换＆＃39; 6a＆＃39;随机数。

我已经能够为每次点击生成一个随机字符串，如果我删除了数组中的所有其他字符串，我就可以替换字符串中的数字，但我无法使所有内容都能正常工作一起。这是我的代码到目前为止的样子！

提前感谢您的帮助！

＆＃13;

//strings that I want to generate and change

var events = ['String one 6a',
  
'String two 6a',

'String three 6a',

'String four 6a',

'String five 6a',

];

//function click generating new random string

function newEvent() {
  var randomNumber = Math.floor(Math.random() * (events.length));
  var b = randomNumber;
  document.getElementById("thing").innerHTML = events[b];
};

//attempt to change part of a string to a random number

function numChange() {
  for (var i = 0; i < events.length; i++) {
      events[i] = events[i].replace('6a', function(match) {
        Math.floor(Math.random() * 7);
      } );
  };
}

＆＃13;

<body>
  <div id="thing">
    <p>
      We're replacing this thing
    </p>
  </div>
  <button onclick="newEvent()">
    Click me
  </button>
</body>

＆＃13;

Answer 1

如果您使用字符串控制数组，请执行此操作。

var events = [
  'String one ',
  'String two ',
  'String three ',
  'String four ',
  'String five '
];

function newEvent() {
  var randomArrayString = Math.floor(Math.random() * (events.length));
  var randomNumber = Math.floor(Math.random() * 10)
  document.getElementById("thing").innerHTML = events[randomArrayString] + randomNumber;
};

<body>
  <div id="thing">
    <p>
      We're replacing this thing
    </p>
  </div>
  <button onclick="newEvent()">
    Click me
  </button>
</body>

如果您无法控制数组字符串，请使用str.replace()

中的regexp

var events = [
'String one 6a',
  'String two 6a',
  'String three 6a',
  'String four 6a',
  'String five 6a'
];

function newEvent() {
  var randomArrayId = Math.floor(Math.random() * (events.length));
  var randomNumber = Math.floor(Math.random() * 10)
  document.getElementById("thing").innerHTML = events[randomArrayId].replace(/6a/,randomNumber);
};

<body>
  <div id="thing">
    <p>
      We're replacing this thing
    </p>
  </div>
  <button onclick="newEvent()">
    Click me
  </button>
</body>

Answer 2

这是一个简洁明了的解决方案：

let events = ['String one 6a',
  
'String two 6a',

'String three 6a',

'String four 6a',

'String five 6a',

];

function numChange() { 
  events = events.map(event => event.replace('6a', Math.floor(Math.random() * 7)));
};

function newEvent() {
  let randomNumber = Math.floor(Math.random() * (events.length));
  document.getElementById("thing").innerHTML = events[randomNumber]
};

//execute once to replace '6a' with a random number
numChange();

<body>
  <div id="thing">
    <p>
      We're replacing this thing
    </p>
  </div>
  <button onclick="newEvent()">
    Click me
  </button>
</body>

Answer 3

应该像：

＆＃13;

//<![CDATA[
/* external.js */
var doc, bod, htm, M, I, S, Q, old = onload; // for use on other loads
onload = function(){
if(old)old(); // change old var name if using technique on other pages
doc = document; bod = doc.body; htm = doc.documentElement;
M = function(tag){
  return doc.createElement(tag);
}
I = function(id){
  return doc.getElementById(id);
}
S = function(selector, within){
  var w = within || doc;
  return w.querySelector(selector);
}
Q = function(selector, within){
  var w = within || doc;
  return w.querySelectorAll(selector);
}
var events = ['String one 6a', 'String two 6a', 'String three 6a', 'String four 6a', 'String five 6a'];
I('f').onsubmit = function(){
  return false;
}
function randEventRep(){
  return events[Math.floor(Math.random()*events.length)].replace(/\b6a\b/g, Math.floor(Math.random()*7));
}
var press = I('press'), thing = I('thing');
press.onclick = function(){
  thing.innerHTML = randEventRep();
}
} // end load
//]]>

＆＃13;

/* external.css */
html,body{
  padding:0; margin:0;
}
body{
  background:#000; overflow-y:scroll;
}
.main{
  width:940px; background:#ccc; padding:20px; margin:0 auto;
}

＆＃13;

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
  <head>
    <meta http-equiv='content-type' content='text/html;charset=utf-8' />
    <meta name='viewport' content='width=device-width' />
    <title>Test Template</title>
    <link type='text/css' rel='stylesheet' href='external.css' />
    <script type='text/javascript' src='external.js'></script>
  </head>
<body>
  <div class='main'>
    <form id='f' name='f'>
      <p id='thing'>This is the thing we&apos;re changing</p>
      <input id='press' type='button' value='Click Me' />
    </form>
  </div>
</body>
</html>

＆＃13;

替换数组中多个字符串上的单词

3 个答案: