javascript - Javascript或jQuery在页面刷新时显示随机元素

Question

我正在为博客网站上的自定义主题开发网站。我想要一个评论部分，但我只想在每次页面刷新时有一个评论。我想知道是否有任何方法可以使用 jQuery 或 javascript 编写脚本（我不确定是哪一个）从数组中选择一个随机元素（所有评论都有一个单独的元素，每个人都有不同的 div具有不同评论的 ID）并在名为#reviews 的 div 中显示该元素，并隐藏其他元素？这听起来很混乱，但基本上我需要 jQuery 或 javascript 来选择评论并将其放在评论部分。如果有人可以提供帮助，将不胜感激。

Answer 1

这是jsFiddle的一种方式

<aside id="reviews">
    <article class="review"></article>
    <article class="review"></article>
    <article class="review"></article>
</aside>​

和

var $reviews = $('#reviews .review').hide();
$reviews.eq(Math.random()*$reviews.length).show();​

但是，除非您计划在某个时间点（滑块或分页）显示其他评论，否则您真的应该做这个服务器端。发送内容只是为了隐藏它有点浪费。

Answer 2

jQuery是JavaScript。要从数组中获取随机元素，请使用 Math.random()：

function getRandomElement(a) {
    return a[Math.floor(Math.random() * a.length)];
}

Answer 3

我会使用 knockout.js，它非常适合将 JavaScript 对象绑定到 DOM。您可以填充对象数组并将其数据绑定到 div。每次您将数组的随机元素绑定到 div。数据绑定非常简单：

<p>First name: <input data-bind="value: firstName" /></p>


// This is a simple *viewmodel* - JavaScript that defines the data and behavior of your UI
function AppViewModel() {
 this.firstName = "Bert";  
}

// Activates knockout.js
ko.applyBindings(new AppViewModel());

有关更多示例，请参阅以下精彩教程： Knockout.js 教程