从数组Javascript生成随机句子

时间:2015-10-16 00:41:32

标签: javascript jquery web random

对于课堂作业,我们需要建立一个有趣的网站,突出JavaScript的随机功能。我的网站是一个哟妈妈的笑话生成器,所以每次刷新页面时,都会出现一个新的笑话。但是,我的代码不起作用,我似乎无法弄清楚它为什么不是。我是初学者,所以任何帮助都将不胜感激! :)

这是我的代码:

function setup() {
  createCanvas(windowWidth, windowHeight, WEBGL);

  smooth ();
}


function draw () {
    background (255, 255, 255);
}

function getRandomSentence () {
    var index= Math.floor(Math.random() * (maxSentences - 1));
    return sentences[index];
}

var sentences= [
    'so fat not even Dora can explore her',
    'so  fat I swerved to miss her and ran out of gas',
    'so smelly she put on Right Guard and it went left',
    'so fat she hasn’t got cellulite, she’s got celluheavy',
    'so fat she don’t need no internet – she’s already world wide',
    'so hair her armpits look like Don King in a headlock',
    'so classless she could be a Marxist utopia',
    'so fat she can hear bacon cooking in Canada',
    'so fat she won “The Bachelor” because she all those other bitches',
    'so stupid she believes everything that Brian Williams says',
    'so ugly she scared off Flavor Flav',
    'is like Domino’s Pizza, one call does it all',
    'is twice the man you are',
    'is like Bazooka Joe, 5 cents a blow',
    'is like an ATM, open 24/7',
    'is like a championship ring, everybody puts a finger in her'
],

maxSentences = sentences.length;

这是我的HTML:

<html>
    <head>
        <title>new tab</title>

        <meta charset="utf-8">

        <script src='./js/jquery-2.1.1.min.js' type='text/javascript'></script>
        <script src='./js/p5.min.js' type='text/javascript'></script>
        <script src='./js/sketch.js' type='text/javascript'></script>
        <script src='./js/main.js' type='text/javascript'></script>

        <link href='./css/reset.css' media='all' rel='stylesheet' type='text/css' />
        <link href='./css/main.css' media='all' rel='stylesheet' type='text/css' />
    </head>
    <body>

    </body>
</html>

2 个答案:

答案 0 :(得分:0)

在您的HTML文件中,<body> ... </body>之间添加以下代码:

<p id="MyRandomSentence"></p>

在JavaScript文件的末尾,添加以下代码行:

var element = $("#MyRandomSentence");
var sentence = getRandomSentence();
element.text(sentence);

答案 1 :(得分:0)

我不知道为什么我这样做;我对这个世界太软了吗?

这是一个粗略的模板,你可以开始玩

<!DOCTYPE html>
<html>
<head>
<!-- You need UTF-8 here because you use some characters not in ASCII -->
<meta http-equiv="content-type" content="text/html; charset=UTF8">
<script>
/*
    Math.random() returns a number between 0 and 1 excluding 1 itself.
    That together with floor function returns a number between 0 and
    max-1 (here max = sentence.length) and fits the zero-based numbering
    of the elements in the array
*/
function getRandomSentence () {
    var index= Math.floor(Math.random() * (sentences.length));
    return sentences[index];
}

var sentences= [
    'so fat not even Dora can explore her',
    'so  fat I swerved to miss her and ran out of gas',
    'so smelly she put on Right Guard and it went left',
    'so fat she hasn’t got cellulite, she’s got celluheavy',
    'so fat she don’t need no internet – she’s already world wide',
    'so hair her armpits look like Don King in a headlock',
    'so classless she could be a Marxist utopia',
    'so fat she can hear bacon cooking in Canada',
    'so fat she won “The Bachelor” because she all those other bitches',
    'so stupid she believes everything that Brian Williams says',
    'so ugly she scared off Flavor Flav',
    'is like Domino’s Pizza, one call does it all',
    'is twice the man you are',
    'is like Bazooka Joe, 5 cents a blow',
    'is like an ATM, open 24/7',
    'is like a championship ring, everybody puts a finger in her'
];

function scribble(){
  // get the canvas element you want to write to
  var canvas = document.getElementById("woodcut");
  // get a handle for the above canvas (here 2d only for simple text)
  var context = canvas.getContext("2d");
  // the canvas is blank the first time only, so erase the content
  // even if it is already blank, checking for it would be more
  // complicated and slower, too
  context.clearRect(0, 0, canvas.width, canvas.height);
  // choose a font (you can choose the size also as you can see)
  context.font = "30px Arial";
  // the letters are filled and they are filled in red
  context.fillStyle = "red";
  // center the text horizontally
  context.textAlign = "center";
  // put a random line in the middle of the canvas
  // the +10 account for the fonttype's height
  context.fillText(getRandomSentence(),0, canvas.height/2 + 10);
}
</script>
</head>
<body>
An indifferent opinion<br>
<canvas id="woodcut" width="1000" height="100"
style="border:10px solid #665599;">
This text shows up if the canvas element is  not supported
</canvas>
<br>
<button onclick="scribble()">scribble</button>


</body>
</html>

这不是最好的风格,至少可以说它只是为了玩耍。

噢,太晚了!再次!