如何在一个 <p> 标签中显示来自不同数组的两个随机字符串

How to show two random strings from separate arrays in one <p> tag

本文关键字：数组 字符串 随机 两个 一个 标签 显示      更新时间：2023-09-26

我是JS的新手，我正在尝试制作两个使用math.random（）选择的随机字符串，并将它们放入我的p标签中，以便我最终可以得到诸如"风暴破坏者"或"城堡食客"之类的东西，但似乎我只能显示名字（fname）或姓氏（lname）。我试着做

document.getElementById("print").innerHTML=fname,lname;

这不起作用，所以我也尝试了：

document.getElementById("print").innerHTML=fname;
document.getElementById("print").innerHTML=lname;

但正如你所知道的，这只会改变名字的位置。

<h1 class="title">Welcome to Tom's Random Name Generator!</h1>
<button type="button" onclick="myFunction();">Generate!</button>
<p id="print"></p>
<script>
function myFunction() {
    var fnamel = ['Storm','Wind','Castle','Chocolate','Savage'];
    var lnamel = ['Breaker','Eater','Smasher','Killer','Fury'];
    var fname = fnamel[Math.floor(Math.random()*fnamel.length)];
    var lname = lnamel[Math.floor(Math.random()*lnamel.length)];
    document.getElementById("print").innerHTML=fname;  
}
</script>

像这样更改：

 document.getElementById("print").innerHTML=fname + " " + lname;

最终代码 ：

<html>
    <head>
        <style>
        </style>
    </head>
    <body>
        <h1 class="title">Welcome to Tom's Random Name Generator!</h1>
<button type="button" onclick="myFunction();">Generate!</button>
<p id="print"></p>
<script>
function myFunction() {
    var fnamel = ['Storm','Wind','Castle','Chocolate','Savage'];
    var lnamel = ['Breaker','Eater','Smasher','Killer','Fury'];
    var fname = fnamel[Math.floor(Math.random()*fnamel.length)];
    var lname = lnamel[Math.floor(Math.random()*lnamel.length)];
    document.getElementById("print").innerHTML=fname + " " + lname;  
}
</script>
    </body>
</html>

您可以使用加号运算符在 javascript 中连接字符串。

  document.getElementById("print").innerHTML=fname + ' ' + lname;
相关文章：