Javascript 无法通过jquery在动态生成的div上设置顶部/左侧属性

已经在网站上和互联网上搜索了一次又一次，而且到目前为止运气还不错

我通过JQuery从原始html源代码克隆了一组动态生成的div。 虽然我可以设置和使用原始div的占有属性，但克隆的div根本不会重新绑定到height和width属性，尽管我可以选择它们而不会出现问题

以下是原始HTML：

下面是JS代码：

最后，这里是tiles.php返回的Json数据：

虽然for/in循环中的最后一行工作正常，但另一行没有设置left和top属性，也没有抛出任何错误消息

为什么会这样？这是因为我怀疑第二组div是由dinamic生成的吗？我怎样才能解决它

编辑：

添加了tiles.php返回的Json对象 在for/in块勘误表中，由this.mainHolder更改了this.tileHandler。 注意：不确定上述片段中克隆元素的id是否已更改，但显示的内容可能已更改，因此在.clone之后的文档中不是两个具有相同值的id吗

另外，不确定数据定义在哪里？平铺是元素的DOM样式属性吗

请澄清什么是数据和磁贴变量。谢谢

也许第一次尝试引用css属性

试一试

---

最后，这是extractId函数的一个问题，尽管我在发布之前已经测试了一次又一次

函数按原样重新调用字符串的数字id部分，但在其前面加一个下划线字符。因此，在最后，我得到了一个带有双下划线id的克隆div

---

很抱歉给您带来不便，感谢您的努力。

您正在尝试为函数设置属性。。。我想您是想执行函数您是想使用.position还是.position数据中的对象？data[tile]。position只是dataId中的一个对象，而克隆div中的一个对象实际上已经通过使用自定义函数extractId进行了更改。因此不存在重复的id；这已经过测试并且工作正常。@user2697714是元素的DOM样式属性吗？周围带引号的css属性是否更改了这些css属性？数据只是一个json对象，包含由自定义函数getDataJsonServer重新调用的数据。其中的数据被正确地排列为一个tile数组，这也是它应该工作的。tile只是for in块中的索引。使用引号包围css属性并没有解决问题，除了for中的第一行之外，它工作得非常好…@user2697714不确定tile是什么？如果可能，您可以创建一个JSFIDLE吗？

<div style="width: 504px; height: 252px; left: 333px; top: 135px;" id="mainHolder">
    <div style="width: 504px; height: 252px;" id="holder">
        <div style="width: 126px; height: 63px;" id="idTile_5369" class="tile"></div>
        <div style="width: 126px; height: 63px;" id="idTile_5373" class="tile"></div>
        <div style="width: 126px; height: 63px;" id="idTile_5377" class="tile"></div>
        <div style="width: 126px; height: 63px;" id="idTile_5381" class="tile"></div>                   
    </div>
    <div id="holderHandler"></div>
</div>

#mainHolder{
    position: relative;
}
#holder, #holderHandler, .tile, .tileHandler{
    position: absolute;
}

getDataJsonServer('tiles.php', (function(data){ //getDataJsonServer --> custom function to obtain json data from the server through the JQuery getJson method
    var mainHolder=$('#mainHolder');
    var tilesHandler=$('#holder .tile', this.mainHolder).clone();
    tilesHandler.addClass('tileHandler');
    tilesHandler.removeClass('tile');
    tilesHandler.attr('id', function(i, idTileHandler){ return 'idTileHandler_'+extractId(idTileHandler); }); //extractId -->  custom function that extracts the id
    $('#holderHandler', this.mainHolder).append(tilesHandler);

    for(var tile in data){
        $('#idTile_'+data[tile].idTile, this.mainHolder).css({left: data[tile].position.left, top: data[tile].position.top});
        $('#idTileHandler_'+data[tile].idTile, this.mainHolder).css({left: data[tile].positionHandler.left, top: data[tile].positionHandler.top});
    }
}

"data": [{
    "idTile": 5369,
    "position": {
        "left": -62,
        "top": 0
    },
    "positionHandler": {
        "left": -62,
        "top": 0
    }
},
"idTile": 5373,
    "position": {
        "left": -62,
        "top": 0
    },
    "positionHandler": {
        "left": -62,
        "top": 0
    }
},
"idTile": 5377,
    "position": {
        "left": -62,
        "top": 0
    },
    "positionHandler": {
        "left": -62,
        "top": 0
    }
},
"idTile": 5381,
    "position": {
        "left": -62,
        "top": 0
    },
    "positionHandler": {
        "left": -62,
        "top": 0
    }
}]

for(var tile in data){
        $('#idTile_'+data[tile].idTile, this.tilesHandler).css({"left": data[tile].position.left, "top": data[tile].position.top});
        $('#idTileHandler_'+data[tile].idTile, this.tilesHandler).css({"left": data[tile].positionHandler.left, "top": data[tile].positionHandler.top});
    }