javascript - HtmlCollection または NodeList のインデックス作成

Question

別のノードの子であるノードを複製しようとしていますが、js では HTMLCollection/NodeList データ型のインデックスを作成できません。そのデータ型にインデックスを付けようとすると、常に未定義の値になります。HTMLCollectionを配列に変換する最も効率的な方法に従ってそのデータ型を配列に変換しても、配列にインデックスを付けることができません。

var viewports = document.getElementsByClassName('imageViewerViewport');
console.log(viewports[0].childNodes)  // In the console shows the children I expect to see
console.log(viewports[0].childNodes.item(0))  // Nothing shows up  - undefined
console.log(viewports[0].childNodes.item(1))  // Nothing shows up  - undefined
console.log(viewports[0].children.item(0))  // Nothing shows up  - undefined
console.log(viewports[0].children.item(1))  // Nothing shows up  - undefined    
console.log(viewports[0].childNodes[0])  // Nothing shows up  - undefined
console.log(viewports[0].childNodes[1])  // Nothing shows up  - undefined    
console.log(viewports[0].children[0])  // Nothing shows up  - undefined
console.log(viewports[0].children[1])  // Nothing shows up  - undefined
console.log("Here")
var second_canvas = viewports[0].children.item(1).cloneNode(true);  // Error that is detailed below
viewports[1].appendChild(second_canvas);

ノードのクローン作成で発生するエラー: Cannot read property 'cloneNode' of undefined。