如何使用 jQuery ajax 检查文件是否存在于 JS 数组中？

Question

I have an array urlResult which collects the href attribute of all a elements on a component. Looks like:

All I need to do is use jQuery $.ajax() method to check against those URL's and in each callback do something if there is success or failure. So I was thinking of something like:

$.ajax({
    url: urlResult[i] // somehow use dynamic variable?
    type:'HEAD',
    error: function()
    {
        //file not exists
    },
    success: function()
    {
        //file exists
    }
});

I just need some guidance on how to dynamically include urlResult variable and pass each index to url property in ajax call.

Answer 1

You can use .forEach() to loop over the array of hrefs, and then execute your code inside the loop

 const urlResult = ['www.google.com', 'www.test.com', 'www.demo.com', 'www.aaaa.net']; urlResult.forEach((href) => { $.ajax({ url: href, type: 'HEAD', error: function() { console.log('HREF was ' + href); console.log('error'); }, success: function() { console.log('HREF was ' + href); console.log('success'); } }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 2

Consider the following code.

$(function() {
  function checkFile(u) {
    var result = false;
    $.ajax({
      url: u
      type: "HEAD",
      success: function() {
        result = true;
      }
    });
    return result;
  }

  $.each(urlResult, function(i, v) {
    if (checkFile(v)) {
      // File exists, do the needful
    }
  });
});

Remember that success is only called when HTTP Status is 200 . I used $.each() to iterate over the Array.

The $.each() function is not the same as $(selector).each() , which is used to iterate, exclusively, over a jQuery object. The $.each() function can be used to iterate over any collection, whether it is an object or an array. In the case of an array, the callback is passed an array index and a corresponding array value each time.

See More:

• https://api.jquery.com/jquery.ajax/
• https://api.jquery.com/jQuery.each/