下記の様にディテクトリに含まれるファイルを複数、再帰的に取得しているのですが、配列に格納される順番の法則が結果からよくわかりません、ドキュメンテーションを探しているのか、見つからず、名前順や編集日順などプロパティを見ても法則がわかりません。
どなたかご存知の方がいらっしゃればご教示いただけますでしょうか?
html
1input type="file" webkitdirectory directory onChange="fileListDirectory(this.files)" style="display:none"> 2 3<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> 4<script> 5 function fileListDirectory(files) { 6 $('.list').empty();$('.thumb').empty(); 7 var len = files.length; 8 var name = new Array(); 9 var pass = new Array(); 10 for (i=0; i<len; i++) { 11 name[i] = files[i].name; 12 pass[i] = files[i].webkitRelativePath;//here 13 } 14 15 16 for (i=0; i<len; i++) { 17 var elm = ""; 18 if(pass[i].indexOf('.pdf')!==-1){ 19 var click = "click" 20 }else{ 21 var click = "click_otr" 22 } 23 var count = 0; // 文字数を格納 24 var strSearch = '/'; // 探す文字 25 for (var j = 0; j < pass[i].length; j++){ 26 if (pass[i][j] == strSearch){ 27 count ++; 28 } 29 } 30 31 switch (count) { 32 case 1:elm +='<div id="l_'+i+'" class="t1 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 33 case 2:elm +='<div id="l_'+i+'" class="t2 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 34 case 3:elm +='<div id="l_'+i+'" class="t3 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 35 case 4:elm +='<div id="l_'+i+'" class="t4 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 36 case 5:elm +='<div id="l_'+i+'" class="t5 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 37 case 6:elm +='<div id="l_'+i+'" class="t6 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 38 case 7:elm +='<div id="l_'+i+'" class="t7 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 39 case 8:elm +='<div id="l_'+i+'" class="t8 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 40 case 9:elm +='<div id="l_'+i+'" class="t9 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 41 case 10:elm +='<div id="l_'+i+'" class="t10 '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>';break; 42 default:elm +='<div id="l_'+i+'" class="t_et '+click+'" data-pass="'+pass[i]+'">'+name[i]+'</div>'; 43 } 44 $('.list').append($(elm)); 45 46 47 } 48 $('.list').addClass('add_line'); 49 $('.thumb').addClass('add_line'); 50 } 51 $(document).on('click','.click',function(){ 52 $(this).toggleClass('clicked') 53 54 var get_pass = $(this).data("pass"); 55 $('.thumb').empty(); 56 $('.thumb').append('<object data='+get_pass+'></object>'); 57 }) 58 59 $(document).on('click','.click_otr',function(){ 60 $(this).toggleClass('clicked_otr') 61 62 var get_pass = $(this).data("pass"); 63 $('.thumb').empty(); 64 $('.thumb').append('<object data='+get_pass+'></object>'); 65 }) 66</script>