javascript - 在javascript中使用两个数组进行循环

Question

我是 js 的新手，遇到了这个问题。我有两个数组，喜欢使用 for 循环实现这种布局。我不知道如何写这个来实现它。这是我的代码。请帮忙。

var html ='';
var option = ['meal', 'drink'];
var option_type = ['big', 'medium', 'small', 'big', 'medium'];

for (var i in option){
    for ( var j in option_type){
        html += '<div>'+ option[i] + '</div>'+'<p>'+option_type[j]+'</p>';
    }
}

.(class).html(html);

Answer 1

你可以像这样使用for:

var html = '';
var option = ['meal', 'drink'];
var option_type = ['big', 'medium', 'small'];

for (i = 0; i < option.length; i++) {
  html += '<div>' + option[i] + '</div>';        //Add option here (header)
  for (j = 0; j < option_type.length; j++) {
    html += '<p>' + option_type[j] + '</p>';     //Add option_type 
  }
}

$('body').html(html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>