Как отобразить все элементы или значения массива с помощью цикла в jQuery

jQuery.each() или $.each() можно использовать для беспрепятственного перебора любой коллекции, будь то объект или массив. Однако, поскольку функция $.each() извлекает и использует свойство length переданного массива или объекта, то, если у вас есть свойство с именем length — например, {en: 'english', length: 5} функция может работать некорректно.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Print Array Values with Loop</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
    $(document).ready(function(){
        var fruitsArray = ["Apple", "Banana", "Orange", "Mango", "Pineapple"];
        $.each(fruitsArray, function(index, value){
            $("#result").append(index + ": " + value + '<br>');
        });
    });
</script>  
</head> 
<body>
    <div id="result"></div>
</body>
</html>

Точно так же вы можете распечатать содержимое объекта через цикл, как показано ниже:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Display Object Contents with Loop</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
    $(document).ready(function(){
        var supercarObject = {"brand": "Lamborghini", "model" : "Huracan", "origin": "Italy"};
        $.each(supercarObject, function(key, value){
            $("#result").append(key + ": " + value + '<br>');
        });
    });
</script>  
</head> 
<body>
    <div id="result"></div>
</body>
</html>

Читайте также

Похожие примеры: