在 DOM 创建中将 jQuery 与原生 JS 结合起来

Question

我正在重用我的旧应用程序，并且想要更改代码，因此我将构建的 DOM 结构应用到节点的类而不是它的 id。

下面是一段代码，正如您所看到的，我尝试将 jQuery（通过其类获取节点）与旧结构结合起来，但有些东西在这里无法正常工作。

是否可以像这样将 jQuery 和 JS 原生结合起来？ 如果没有，还有其他方法可以完成我想做的事情吗？

var gamearea = $('<div/>', {
    text': 'testarea',
    class': 'gamearea'
}).appendTo('.memory:last');    

alert("this.rows: " + this.rows);

for (var j = 0; j < this.rows; j++){
    var box = document.createElement('div');
    for (var i = 0; i < this.cols; i++){

        var iterator = (this.cols * j) + i;

        var img = document.createElement('img');
        var aNod = document.createElement('a');

        aNod.href = "#";
        img.src = "pics/0.png";

        aNod.appendChild(img);
        box.appendChild(aNod);
    }   
    gamearea.appendChild(box);
}

Answer 1

您应该能够通过将 gamearea.appendChild(box); 更改为 gamearea[0].appendChild(box); 来使其工作，

其背后的原因是您可以得到只需执行 obj[0] 即可获取 jQuery 扩展对象的裸 DOM 元素，其中 obj 是像 obj = $(... ) 等等。代码中的 appendChild 方法是裸 DOM 元素的方法。