createElement() +appendChild()——DOM 方法

我试图在“div”内创建一个“a”元素，并在该“a”元素中添加“div”元素中已存在的“img”图像。但是，我对此表示怀疑，因为以下代码不起作用。

document.querySelectorAll(".card").forEach(function(div){
      
    div.appendChild(document.createElement("a"))
    div.querySelector("a").appendChild(div.querySelector(".image"))
        // OUPUT
        // <div class="card">
        //     <a>
        //         <img class="image" alt="image-1" id="image-1">
        //     </a>
        // </div>


     // NOT WORK
    div.appendChild(document.createElement("a").appendChild(div.querySelector(".image")))
        // OUTPUT
        // <div class="card">
        //     <img class="image" alt="image-1" id="image-1">
        // </div>
})

以下是 @CBroe 在他的第一条评论中建议的内容（使用多行）：

document.querySelectorAll(".card").forEach(function(div){
      
  const a = document.createElement("a");
  a.appendChild(div.querySelector(".image"));
  div.appendChild(a);

})

我担心这段代码正在移动.image查询到every .card a虽然有标签。一个 DOM 对象只能有一个父对象，并且每个appendChild(div.querySelector(".image"))将相应地更改父级。