Question

所以我想显示随机div，我在这里找到了这个stackoverflow解决方案：Showing random divs using Jquery

正确答案使用此代码：http://jsfiddle.net/nick_craver/RJMhT/

所以我想做上述事情，但对于我的生活，我不知道如何。

我认为它会像

一样简单

<html>
<head>
<script type="text/javascript">
var divs = $("div.Image").get().sort(function() {
   return Math.round(Math.random())-0.5; //random so we get the right +/- combo
  }).slice(0,4)
$(divs).appendTo(divs[0].parentNode).show();
</script>
<style type="text/css">
div.Image { 
  display: none;
}
</style>
</head>
<body>
  <div class="Image"><img src="/image1.jpg">1</div>
  <div class="Image"><img src="/image2.jpg">2</div>
  <div class="Image"><img src="/image3.jpg">3</div>
  <div class="Image"><img src="/image4.jpg">4</div>
  <div class="Image"><img src="/image5.jpg">5</div>
  <div class="Image"><img src="/image6.jpg">6</div>
  <div class="Image"><img src="/image7.jpg">7</div>
</body>
</html>

但显然不是，因为我的屏幕上没有显示任何内容。有人能帮助我吗？对于那些对我认为的javascript知之甚少的人来说，真的很容易。

谢谢你！

Answer 1

在解析页面正文的HTML代码之前，您正在运行脚本，因此元素尚不存在。

将您的代码放入页面的ready事件中：

$(document).ready(function(){
  // your Javascript code goes here
});

另外，正如Conner所示，你缺少jQuery库的包含。

Answer 2

您需要导入jQuery库。

添加

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

在您的javascript代码之前

到<head>标记。

用javascript显示随机div

2 个答案: