在每个刷新的不同位置</div>的页面上随机附加<div>标记

Question

我在页面上收集了两种类型的<div>。

类型集合1：

<div class="feature">content 1</div>
<div class="feature">content 2</div>
and so on.

类型集合2：

<div class="native-content-1">My native code 1</div>
<div class="native-content-2">My native code 2</div>

在每个页面上加载div应该从集合1中随机挑选并附加到从集合2中随机选择的div。

Answer 1

我正在使用一个随机函数，该函数将返回给定范围内的数字。

我希望这是你的期望：

＆＃13;

＆＃13;

$(document).ready(function() {
  function onPageLoad() {

    var no_of_features = $(".feature").length
    var selectedRandomFeature = getRandomInt(0, no_of_features - 1);


    var no_of_natives = $("[class^='native-content-']").length;
    var selectedRandomnative = getRandomInt(1, no_of_natives)
    $($(".feature")[selectedRandomFeature]).append($(".native-content-" +   selectedRandomnative))



  }

  function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
  }

  onPageLoad();
});

＆＃13;

.feature {
  height: 100px;
  width: 100px;
  background-color: black;
  color: white;
  float: left;
  margin-left: 10px;
  margin-top: 20px;
}
[class^='native-content-'] {
  height: 50px;
  width: 50px;
  background-color: green;
  color: white;
  margin-top: 10px;
  margin-left: 10px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="native-content-1">My native code 1</div>
<div class="native-content-2">My native code 2</div>
<div class="native-content-3">My native code 3</div>
<div class="feature">content 1</div>
<div class="feature">content 2</div>
<div class="feature">content 3</div>
<div class="feature">content 4</div>
<div class="feature">content 5</div>

＆＃13;

＆＃13;

＆＃13;