Question

所以，我正在按照教程制作一个youtube搜索引擎，它将显示来自youtube的一些视频。这是教练提到每个循环的第一个视频。我查看了JQuery文档，但仍然无法理解每个循环正在尝试做什么。我跟随导师一直很好，直到他在下面的代码结尾附近引入了每个循环。我不太确定教练在这个循环中做了什么。任何见解都会有所帮助

function search()
{
    $('#results').html('');
    $('#buttons').html('');

    // get form input
    q = $('#query').val();

    //run GET Request on API

    $.get(
    "https://www.googleapis.com/youtube/v3/search",{
        part:'snippet,id',
        q:q,
        type: 'video',
        key:'AIzaSyCadgai_XAKk2TYQH1f5lXrR5QEHWXowfA'
        },
        function(data)
    {
        var nextPageToken = data.nextPageToken;
        var prevPageToken = data.prevPageToken;
        // Log data
        console.log(data);

        $.each(data.items,function(i,item))
        {
               var output = getOutput(item);

        $('#results').append(output);
               }

    }
    );

}

Answer 1

它基本上只是一个循环，但使用jQuery函数语法。这种语法的好处是当你想要遍历一组选定的DOM元素时，因为jQuery的核心功能是查询DOM的简单性。虽然也适用于任何集合，但并不总是必要的（除非您只是想使用语法来保持一致性）。

i只是迭代它给出的元素，在每个元素上调用提供的函数。在函数内，item是索引（0到元素计数减1），$.each(data.items,function(i,item)) { var output = getOutput(item); $('#results').append(output); });是当前元素。（这两个参数可以任意命名，以保持代码清晰易懂。）

基本上，这个：

for (var i = 0; i < data.items.length; i++) {
    var output = getOutput(data.items[i]);
    $('#results').append(output);
}

与此类似：

public class ClassA
    {
        public int id { get; set; }
        public string name { get; set; }
        public int age { get; set; }
        public string note { get; set; }
    }

 public class ClassB
    {
        public int id { get; set; }
        public string name { get; set; }
        public int age { get; set; }
        public string note { get; set; }
        public int index { get; set; }
    }

static void Main(string[] args)
        {
           //create an object with ClassA  type
            ClassA a = new ClassA { id=1,age=12,name="John",note="good"};
            ClassB b=a.Cast<ClassB>();
        }

Answer 2

通过查看代码，我可以看出你从ajax调用中获得的响应是一个对象。所述对象具有称为项的属性。由于教练是'＃34; foreaching＆＃34; items属性，我可以断定它是一个数组。因此，.each()正在迭代data.items数组中的每个项目，以对每个项目执行操作。

现在，您还没有包含getOutput()函数的代码，但基于其余代码，我可以看到它使用.each()循环中的当前项生成HTML标记。从getOutput()获取HTML标记后，它会将HTML附加到id =＆＃34;结果＆＃34;它将在屏幕上显示（假设结果元素可见）。

希望能帮助您了解它正在做什么！

理解.each循环和一些语法

2 个答案: