将内容写入iframe javascript / jquery中的iframe

Question

我认为我所得到的可能不需要太多调整，但是当我尝试以下内容时：

<div id="exp_div"></div>
<script>
procedure = [
    [
      "content 1","content 2"
      ]
    ]

procedure.forEach(function(this_proc,index){
  $("#exp_div").append("<iframe id='trial"+index+"' width='800px' height='800px'></iframe>");
  trial_iframe_code = '';
  for(var i = 0; i < this_proc.length; i++){
     trial_iframe_code += "<iframe id='post"+i+"'></iframe>";
  }
  doc = document.getElementById('trial'+index).contentWindow.document;
  doc.open();
  doc.write(trial_iframe_code);
  doc.close();
  for(var i = 0; i < this_proc.length; i++){
    trial_content = this_proc[i];
      console.dir(trial_content);
    doc = document.getElementById('trial'+index).contentWindow.document.getElementById('post'+i);
    doc.open();
    doc.write(trial_content);
    doc.close();
  }
})
</script>

即。在这个fiddle（当我尝试在SO上运行代码时iframe不能正常工作）我得到“doc.open不是函数”的错误 - 我认为这与写入的尝试有关试用iframe中的“post”iframe。是否可以在这种结构中写入iframe中的iframe？我的代码是否接近正确，或者需要采用不同的方法？

为了澄清，这是一个在线心理学实验，用于创建参与者将在一系列iframe中执行的所有任务。由于某些任务中包含多个任务，因此我想在iframe中编写多个iframe。

在这种情况下，工作代码会在“exp_div”中生成一个名为“trial0”的iframe。在“trial0”中会有一个id为“post0”的iframe，其中只写有“内容1”，还有一个id为“post1”的iframe，其中写有“内容2”。