jQuery创建具有动态ID和定义的CSS属性（它定义该div的外观和位置）的DIV

我在这里有一些基本的代码。它只是创建一个div元素到特定的定义位置，并且该ID不是动态的。jQuery创建具有动态ID和定义的CSS属性（它定义该div的外观和位置）的DIV

var i=1; 
while (i<=6) 
{ 
    jQuery('<div/>', { 
     id: 'karta_back' 
     // I don't know how to insert CSS here 
    }).appendTo('#igrac1'); 

    ++i; 
}

问题在于动态ID。用CSS，我不知道如何定义该函数内的CSS。在这个例子中，我使用了文档中某处定义的内部CSS。有了这个职位，我想这些卡片必须是CSS绝对定位才能像我想的那样执行。

这是我有这个简单的代码我写的结果： http://dl.dropbox.com/u/2849320/achieved.png

这就是我想要实现： http://dl.dropbox.com/u/2849320/want%20to%20achieve.jpg

我怎样才能做到这一点？

来源

2011-12-02 Игор Рајачић

是您的关于如何建立动态ID或如何设置每张卡的CSS问题？每张卡片是否都有自己动态创建的CSS，还是都是一样的？ – arb

我需要动态ID我认为@Nicola Peluchetti在他的回答中解决了这个问题，但是我还需要一个具有相同属性的CSS，如所有创建的对象都是相同的背景图像，以及对所有创建的对象都不相同的possition .. –

如果我理解正确的话而已，用style属性，你并不需要一个动态ID：

var i = 1; 
while (i <= 6) { 
    jQuery('<div/>', { 
     id: 'karta_back' + i, //this will add serial number to end of ID 
     //this is a good starting point for what you're trying to accomplish 
     style: 'position:absolute;margin-left:' + i * 20 + 'px;z-index:' + i; 
    }).appendTo('#igrac1'); 

    i++; 
}

所以，你可以选择他们喜欢的：

$('#karta_back1', '#karta_back2'); //selects first two

这里是它的工作，有一个蹩脚的卡图像jsFiddle例子。

来源

2011-12-02 15:45:31 Chad

以及我需要动态ID，所以我可以稍后轻松访问我分离的ID下创建的对象，但是你写的这种风格是有用的，我不知道它可以用来定义函数内的CSS。 –

已更新的答案，对于'动态'ID – Chad

这是我需要的最接近的答案，并且您能否给我一个关于如何重叠卡片的线索，因为此方法不会与它们重叠，它只是在卡片之间产生空间（我认为它具有使用apsolute定位和z-index做些事情，但我还没有试图做到这一点） –

如果你需要创建一个动态的ID，你可以做（对不起，我无法访问您的图片，代理阻止我）：

   var i=1; 
      while (i<=6) 
      {  
       var newId = 'karta_back'+i; 
       jQuery('<div/>', { 
        id: newId 
        //i don't know how to insert css here 

       }).appendTo('#igrac1'); 

       i++; 
      }

，如果你需要访问后这些部件使用attribute starts with selector

$('div[id^=karta_back]')

来源

2011-12-02 15:42:42

你可以像这样指定CSS：id：newId，style：“background：yellow; color：red;”'。或者甚至更好，我会使用'addClass'方法。 – mrtsherman

我会这样做。类是处理样式的更好方法。

http://jsfiddle.net/Ctsus/

var i = 1; 
while (i <= 6) { 
    var newId = 'karta_back' + i; 
    $('<div/>', { 
     id: newId, 
     'class': 'card' 
    }).appendTo('#igrac1'); 

    i++; 
}

#igrac1 div.card { 
    float: left; 
    border: 1px solid black; 
    height: 150px; 
    width: 100px; 
    background: lightblue; 
    margin-left: -30px; 
}

来源

2011-12-02 15:51:06 mrtsherman

这是赢家。 – arb

类：'卡'结果非法使用 –

和顺便说一句，我知道如何定义在