0

編集:すぐ下に新しいコードがあります。その下に元の質問があります。私の1週間前の目には問題ないように見えるので、このコードの何が問題になっているのかについて助けを求めています。

function creatediv(){

    for (i=1;i<13;i++){
        var newcovdiv = document.createElement('div');
        newcovdiv.setAttribute('id',"cover_"+i);
        newcovdiv.style.width="900px";
        newcovdiv.style.height="25px";
        newcovdiv.style.position="relative";
        newcovdiv.style.left="0px";
        newcovdiv.style.top=(i-1)*25+"px";
        newcovdiv.style.background="#FFFFFF";
        newcovdiv.style.display="none";
        document.getElementById('staff').appendChild(newcovdiv);
    }

    var newstaffdiv = document.createElement('div');
    newstaffdiv.setAttribute('id',"staff_sub");
    newstaffdiv.style.width="900px";
    newstaffdiv.style.height="300px";
    newstaffdiv.style.position="relative";
    newstaffdiv.style.left="0px";
    newstaffdiv.style.top="0px";
    newstaffdiv.style.backgroundImage="url(../images/staff_sub.png)";
    newstaffdiv.style.display="none";
    document.getElementbyId('staff').appendChild(newstaffdiv);

    for (i=13;i<101;i++){
        var newcovrdiv = document.createElement('div');
        newcovrdiv.setAttribute('id',"cover_"+i);
        newcovrdiv.style.width="900px";
        newcovrdiv.style.height="25px";
        newcovrdiv.style.position="relative";
        newcovrdiv.style.left="0px";
        newcovrdiv.style.top=(i-1)*25+"px";
        newcovrdiv.style.background="#FFFFFF";
        newcovrdiv.style.display="none";
        document.getElementById('paper').appendChild(newcovrdiv);
    }

}

この場所はこれまで非常に役に立ちました。

私はJavascriptを学び始めたばかりですが、構文は私を魅了し続けています。div要素を動的に作成するjavascript関数の例を見つけ、それをコードに実装しようとしましたが、障害が見つかりましたが、私にはわかりません。コードがどこに悪いのかわかりません。誰かがどの構文(またはもっと悪い)が間違っているかを指摘できますか?

関数を呼び出す

<body onload="creatediv()">

javascript関数は次のとおりです。

function creatediv(){

    for (i=1;i<13;i++){
        var newcovdiv = document.createElement('div');
        newcovdiv.setAttribute('id',"cover_"+i);
        newcovdiv.style.width=900;
        newcovdiv.style.height=25;
        newcovdiv.style.position="relative";
        newcovdiv.style.left=0;
        newcovdiv.style.top=(i-1)*25;
        newcovdiv.style.background="#FFFFFF";
        newcovdiv.style.display="none";
        document.getElementById('staff').appendChild(newcovdiv);
    }

    var newstaffdiv = document.createElement('div');
    newstaffdiv.setAttribute('id',"staff_sub");
    newstaffdiv.style.width=900;
    newstaffdiv.style.height=300;
    newstaffdiv.style.position="relative";
    newstaffdiv.style.left=0;
    newstaffdiv.style.top=0;
    newstaffdiv.style.background-image="url(../images/staff_sub.png);
    newstaffdiv.style.display="none";
    document.getElementbyId('staff').appendChild(newstaffdiv);

    for (i=13;i<101;i++){
        var newcovrdiv = document.createElement('div');
        newcovrdiv.setAttribute('id',"cover_"+i);
        newcovrdiv.style.width=900;
        newcovrdiv.style.height=25;
        newcovrdiv.style.position="relative";
        newcovrdiv.style.left=0;
        newcovrdiv.style.top=(i-1)*25;
        newcovrdiv.style.background="#FFFFFF";
        newcovrdiv.style.display="none";
        document.getElementById('paper').appendChild(newcovrdiv);
    }

}

IDが「paper」と「staff」のdivがすでに存在します。appendChildを使うのは初めてなので、問題があるのではないかと思いました。

これは面倒です。手を貸してくれた人には感謝します。

どうもありがとう。

4

2 に答える 2

1

コードには明らかな問題がいくつかあります。

1)ドット形式を使用する場合、プロパティ名をハイフンでつなぐことができないため、background-imageを使用できません。また、「」がありません。

style.backgroundImage

2)すべての数値タイプのプロパティ(上、左、幅、高さ)はcss文字列であると想定されているため、すべてを次のように変換する必要があります。

style.width = '900px'

3)onload関数はcreatediv()を呼び出しますが、投稿した関数はletsgetitonと呼ばれます。これは、投稿した方法によるものなのか、実際のコードでの方法によるものなのかはわかりません。

4)document.getElement * B *yIdケースが重要

Chrome開発者ツールまたはFirefoxのFirebugを確認することをお勧めします。そのエラーはすぐに現れたでしょう。

于 2012-08-15T01:31:52.107 に答える
1

私は2つの問題に気づきました:


次のコード行は、無効なプロパティにアクセスしようとしており、終了引用符がありません。

newstaffdiv.style.background-image="url(../images/staff_sub.png);

次のようになります。

newstaffdiv.style.backgroundImage="url(../images/staff_sub.png)";

関数を呼び出していますがcreateDiv()、提供されている関数の名前はletsgetiton()です。

于 2012-08-15T01:32:43.850 に答える