Привет, у меня есть этот JavaScript.

<html>
    <div>
        <li class="class0 class1" data-slide-to="0">Start</li>
     </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>
     var i;
         for(i=0; i<3; i++){
             $(".class1").after("<li Class='class0' data-slide-to='"+i+"'>"+i+"</li>");
         }
      </script>  
</html>

И я получаю вывод как

Start
3
2
1
0

Но я хочу получить этот результат в следующем порядке

start
0
1
2
3

Как я могу получить это? Как вернуть результат?

3
John 6 Янв 2017 в 11:28

3 ответа

Лучший ответ

Поскольку вы используете after() метод, он будет добавлен после li. Так что возьмите родителя и добавьте элемент. Хотя вам нужно обновить условие, чтобы генерировать элементы 4, а ваш HTML-код недействителен, li должен быть дочерним по отношению к ul или ol.

<html>
<div>
  <ul>
    <li class="class0 class1" data-slide-to="0">Start</li>
  </ul>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
  var i;
  for (i = 0; i < 4; i++) {
    $(".class1").parent().append("<li Class='class0' data-slide-to='" + i + "'>" + i + "</li>");
  }
</script>

</html>

Или генерировать элементы в обратном порядке.

<html>
<div>
  <ul>
    <li class="class0 class1" data-slide-to="0">Start</li>
  </ul>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
  var i = 4;
  while (i--) {
    $(".class1").parent().append("<li Class='class0' data-slide-to='" + i + "'>" + i + "</li>");
  }
</script>

</html>
2
Pranav C Balan 6 Янв 2017 в 08:58
<html>
<div>
    <li class="class0 class1" data-slide-to="0">Start</li>
 </div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
 var i;
     for(i=3; i>=3; i--){
         $(".class1").after("<li Class='class0' data-slide-to='"+i+"'>"+i+"</li>");
     }
  </script>  
0
Mitesh Pant 6 Янв 2017 в 08:50

Измените ваш сценарий, чтобы работать наоборот. Итак, начните с 3 и остановитесь, когда вы в 0:

 <script>
     var i;
     for(i=3; i>0; i--){
         $(".class1").after("<li Class='class0' data-slide-to='"+i+"'>"+i+"</li>");
     }
  </script>  
2
VinKel 6 Янв 2017 в 08:33