これは、1、2、3、4、5を欲しいものです。 これらはすべて同じスタイルにする必要があります。同じスタイルのforループを作成する
私のコードを実行すると、（5）しか得られません。
誰かが助けてくれますか？
<p id= "text-1"> this </p>
p#text-1{
color:blue;
font-size:20px;
padding:10px;
width:20px;
height:20px;
background:gold;
text-align:center;
}
function forloop(){
for(x = 0; x<=3; x++){
document.getElementById('text-1').innerHTML = x;
}
}
forloop();
あなたがプログラム的に1から3まで行くのリストを作成しようとしている場合、あなたはこのようにそれを行うことができます。ちょうどあなたがここで言ってきたものに基づいて
<html>
<head>
<style>
p#text-1{
color:blue;
font-size:20px;
padding:10px;
width:20px;
height:20px;
background:gold;
text-align:center;
}
</style>
<script>
function forloop(){
var MAX = 3;
for(x=1; x<=MAX; x++) {
document.getElementById('text-1').innerHTML += x;
if(x < MAX) {
document.getElementById('text-1').innerHTML += ", ";
}
}
}
</script>
</head>
<body onLoad="forloop()">
<p id= "text-1"></p>
</body>
</html>
注意、必要なコンテンツをページに直接入れるのは簡単です。この回答は、正確に3つの数字のリストが常に必要なわけではないという前提に基づいています。
あなたのdivは、3つの数字をすべて含むほど十分ではありません。あなたのスタイリングがあなたが望むものであることを確認する必要がありますが、それはこの答えの範囲を超えています。
EDIT：あなたは、独自のボックスにそれぞれ番号が必要な場合、それはそうのように変更されます：
<style>
span.numblock {
color:blue;
font-size:20px;
padding:10px;
width:20px;
height:20px;
background:gold;
text-align:center;
}
</style>
と
<script>
function forloop(){
var MAX = 3;
for(x=1; x<=MAX; x++) {
document.getElementById('text-1').innerHTML += "<span class='numblock'>"+x+"</span>";
if(x < MAX) {
document.getElementById('text-1').innerHTML += ", ";
}
}
}
</script>
のonloadは（）だけにスクリプトを取得することでした走るこれが存在するコンテキストに応じて、必要ないかもしれません。
助けてくれてありがとう、私は作成しようとしている効果に近いです。それぞれの数字を四角で表し、すべての辺に20 pxのパディングがあると考えてください。各番号は20pxの同じパディングを持つ独自の正方形を持つ必要があります。 Imが明確かどうかはわかりませんが、効果を説明するには最良の方法です。また、なぜオンロードが必要なのですか？ – cord
私は、あなたが実際にこれから5つを 'x <= 3'で得ることは信じられません。実際のコードを投稿してください。 –
これは私が作ろうとしているものへのリンクです。はい、あなたは正しいです5。3 – cord
http://codepen.io/2bu/pen/zNWvWo – cord