javascript - 使用javascript显示随机div

标签 javascript html

所以我想显示随机 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 了解最少的人来说应该真的很容易。

谢谢你!

最佳答案

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

将您的代码放在页面的ready 事件中:

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

如 Conner 所示,您还缺少 jQuery 库的包含。

关于javascript - 使用javascript显示随机div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11424285/

相关文章:

javascript - 使用 react-router 为单个路由设置动画

javascript - 创建一个随文本量调整大小的文本区域(普通 JS,无 JQuery)

javascript - 如何在同位素排序后更新编号的 div?

html - 如何在标题中垂直居中文本?

html - 用于 HTML 属性替换/添加的正则表达式

javascript - 获取html标签的大小

javascript - 将普通对象转换为javascript中的类实例

javascript - IE 显示错误,jQuery 错误

javascript - 使用 javascript 或 jquery 提交链接,无需刷新页面

html - 如果你有一个上边距的 child ,为什么 Body Tag 会移动