1

複数の要素のスタイル値を設定するために、JavaScript で大学のプロジェクトのループを作成しました。

for (var i=1; i<6; i++) {
    document.getElementById("profile_details").childNodes[i].style.display =
    "block";
}

私の問題は、「i」の値を警告することによって証明されるように、ループが2回しか繰り返されないことです。望ましい5回ではなく。

ただし、ループ内のステートメントがコメントアウトされていると、ループは正しい回数反復するため、ループが非常に奇妙に動作する原因となるステートメントに問題があると想定しています...

返信/提案は大歓迎です

編集：

すべての迅速な返信に感謝します。ここに profile_details 要素があり、3 つ以上の子要素があることが示されています。

    <ul id="profile_details">
        <li>Artist</li>
        <li style="display:none;">Address: </li>
        <li style="display:none;">City: </li>
        <li style="display:none;">Postcode: </li>
        <li style="display:none;">Telephone: </li>
        <li style="display:none;">Website: </li>
    </ul>
4

4 に答える 4

0

要素にはいくつの子ノードがありますか? （document.getElementById("profile_details").childNodes.length教えてくれます）。ほとんどの場合、3 つしかありません。存在しない配列要素にアクセスしようとすると、エラーが発生します。

于 2013-01-31T19:13:59.990 に答える
0

要素に含まれる子ノードの数がわからない場合は、次のように繰り返すことができます。

var elems = document.getElementById("profile_details").childNodes;
for (var i=1; i<elems.length; i++) {
    elems[i].style.display = "block";
}

念のため、 の最初の要素が , であることにも注意してelemsくださいelems[0](または、反復から最初の要素を除外する必要があるかもしれません)。

編集

新しいブラウザでは、タグ間のすべての文字 (空白文字と改行を含む) もchildNodesコレクションにtextNode. ただし、これらtextNodeの s にはプロパティがないstyleため、ブラウザーはエラーをスローし、ループは失敗します。現在のノードのタイプがスタイリングに有効かどうかを確認する必要があります。

var elems = document.getElementById("profile_details").childNodes;
for (var i=1; i<elems.length; i++) {
    if (elems[i].nodeType === 1) {
        elems[i].style.display = "block";
    }
}

もう 1 つの方法は、 schildrenを含まないコレクションを使用することです。textNode

var elems = document.getElementById("profile_details").children;

jsFiddleでのライブ デモ

于 2013-01-31T19:23:21.170 に答える
0

profile_details要素に少なくとも 5 つの子があることを確認しますか? パフォーマンスと正しく動作するために、代わりにこれを行う必要があります。

var profileDetailsChildren = document.getElementById("profile_details").childNodes;
for (var i=0; i<profileDetailsChildren.length; i++) {
    profileDetailsChildren[i].style.display = "block";
}
于 2013-01-31T19:12:53.200 に答える
0

に 3 つしかないようchildNodesですので、に#profile_detailsアクセスしようとすると TypeError が発生します。styleundefined

コンソールに次のように表示されます。

TypeError: 未定義のプロパティ 'style' を読み取れません

最初に子の数を確認してから、ループをその量に設定する必要があります。

var children = document.getElementById("profile_details").childNodes;

for (var i = 1, l = children.length; i < l; i++) {
    children [i].style.display = "block";
}

これは、最初の子を除くすべての子に影響します。最初のものもこれの影響を受けるようにしたい場合は、カウンターを 0: から開始する必要がありますvar i = 0。

于 2013-01-31T19:10:49.303 に答える