Question

这是我在这里的第一个问题所以请耐心等待我（也是编程的新手）我将尽我所能尽力解释。基本上我想在每次加载页面时以随机顺序显示div内容，这个问题之前已经被问过，我已经遇到过一些问题，但是大部分问题对我来说都很复杂。但我找到了一个非常简单的答案（Random Div Order on Page Load）我试过但我不确定为什么它对我有用，可能它有点过时了？我粘贴下面的代码来为你想象很多，这里是html内容中需要随机化的div：

 <div class="story-container">
  <div class="story">
    <a href="#"><img src="#" alt="some text"></a>
      <h4>Story Title</h4>
  </div>
  <div class="story">
    <a href="#"><img src="#" alt="some text"></a>
      <h4>Story Title</h4>
  </div>
</div>
<div class="story-container">
 <div class="story">
  <a href="#"><img src="#" alt="some text"></a>
    <h4>Story Title</h4>
 </div>
 <div class="story">
  <a href="#"><img src="#" alt="some text"></a>
    <h4>Story Title</h4>
</div>

我可能会添加更多＆＃39; story-container＆＃39;未来的类div。

下面是我从上面提供的链接中给出的帖子中获得的脚本（我用自己的班级替换了目标班级＆＃39;故事＆＃39;）：

<script>
 var cards = $(".story");
 for (var i = 0; i < cards.length; i++) {
 var target1 = math.floor(math.random() * cards.lenth - 1) + 1;
 var target2 = math.floor(math.random() * cards.lenth - 1) + 1;
 cards.eq(target1).before(cards.eq(target2));
}
</script>

我尝试在同一个html页面，标题以及正文部分的末尾使用此代码javascript代码。我也尝试在外部保存它并从我的html页面链接到它但没有运气。

我的jQuery链接/版本如下：

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3
/jquery.min.js"></script>

我在运行js脚本之前导入这个jQuery代码来随机化div。不确定哪里出了问题，我们将非常感谢任何帮助，非常感谢你们！

[PROGRESS]

非常感谢你们的快速回复和详细的指导，@ Hill @fermats_last_nerve @jritchey @Quiver，虽然你修复了代码，但它仍然无法在我的浏览器中工作，这真的很奇怪，因为它在jsfiddle中完美运行， codepen和plunkr。如果它在在线工具中工作，它也应该在我的浏览器中工作。

我使用WAMP作为服务器在Windows 10上测试我的php页面，我通常使用Firefox浏览器，但我也在Microsoft Edge上测试了这段代码，但没有任何乐趣。再次感谢您花时间帮我解决这个问题。

Answer 1

我在this codepen中调试了您的代码。基本上你有3个错误

您对target1和target2的定义中存在拼写错误 cards.lenth应为cards.length
变量牌：var cards = $(".article")正在选择所有带有＆＃34;文章＆＃34;的元素，但你没有该类的任何元素，我认为你的意思是{{1} }
确保在使用时大写var cards = $(".story")。

（编辑）看起来有人编辑了您的帖子，以便在选择器中拥有正确的课程，因此＃2根据新编辑的问题不再有意义，但我会留下它，以防您没有注意到编辑无论出于何种原因。

Answer 2

我注意到你的代码中有一些拼写错误。用下面的代码替换你的jQuery，它应该像在jsfiddle中那样工作。

`enter code here`AttributeError                            Traceback (most recent call last)
<ipython-input-86-5d50a0488b24> in <module>()
      9 file_list = ['df0', 'df1', 'df2', 'df3']
     10 for file in file_list:
---> 11     file.columns = ['date', 'bill_id', 'sponsor_id']
     12 df0.columns = ['date', 'bill_id', 'sponsor_id']
     13 df0 = df0.append(df1)

AttributeError: 'str' object has no attribute 'columns'

JavaScript / jQuery - 如何在页面加载时随机显示html div内容

2 个答案: