2

現在、forループを使用してdivを作成しています。

問題は、forループ内で作成されているすべてのdiv要素に一意のIDを割り当てようとしたときです。

私は近づいていますが、現時点ではカウントは1ではなく36から始まります。

助けてくれてありがとう！

これが私のhtmlです：

<!DOCTYPE html>
<html>
<head>
<title>Intro Webpage!</title>

<meta charset="UTF-8" /> 
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0; target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="style.css"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
</body>
</html>

さて、これは私のscript.jsです：

for(i = 0; i < 35; i++) {
$(document).ready(function(){
    $('body').append('<div id="div'+ (i++) +'" />');
});
}

また、私のcss：

div {
width: 167px;
height: 167px;
border-radius: 10px;
background-color: #ff0000;
display: inline-block;
margin-left: 5px;
}
4

4 に答える 4

4

また、ループ署名であるため、ループ本体内でloop in side document.ready instead of putting document.ready in loopインクリーメントする必要がない場合もあります。document.readyの詳細については、こちらをご覧ください。iincreamented

$(document).ready(function(){
  for(i = 0; i < 35; i++) {
    $('body').append('<div id="div'+ i +'" />');
  }
});
于 2012-12-11T05:17:10.603 に答える
3

提供されたすべての回答でうまくいきますが、より速くしたい場合は、このようにすることができます。また、divid を 1 で開始する場合は、++i代わりにi++. 自動的i++に行われるため、意味がありません。for loop

$(document).ready(function() {
    var divsToAppend = "";
    for (i = 0; i < 35; i++) {
        divsToAppend += '<div id="div' + (++i) + '" />';        
    }
    $('body').append(divsToAppend);
});​​
于 2012-12-11T05:23:44.937 に答える
2

試す：

$(document).ready(function(){
    var html='';
    for(i = 0; i < 35; i++) {
        html += '<div id="div'+ i +'" />';
    }
    $('body').append(html);
});
于 2012-12-11T05:17:41.437 に答える
1

手始めに、$(document).ready をループから外します。

$(document).ready(function() {
    // do loop here
}
于 2012-12-11T05:17:17.223 に答える