X



プログラミング自信ニキ助けて forEach
■ このスレッドは過去ログ倉庫に格納されています
0001以下、5ちゃんねるからVIPがお送りします
垢版 |
2024/02/19(月) 18:17:21.927ID:5MindZoj0
Lists.forEach(function (item, index) {
item.onmouseover = function () {
ListItem.setAttribute('src', ImageList[index]);
}
この場合3行目のImageListの[index]ってListsの中身のインデックス番号を参照してるであってる?
0002以下、5ちゃんねるからVIPがお送りします
垢版 |
2024/02/19(月) 18:18:31.980ID:Cr4lni2L0
うんって言ったら信じるの?
0004以下、5ちゃんねるからVIPがお送りします
垢版 |
2024/02/19(月) 18:22:11.825ID:VbR4EqQ/0
そりゃそうよ
0005以下、5ちゃんねるからVIPがお送りします
垢版 |
2024/02/19(月) 18:23:15.445ID:6ObbvmIT0
はい、その通りです!3行目のImageList[index]は、Listsの中身のインデックス番号を参照しています。

詳細解説:

Lists.forEach(function (item, index) {

Lists: 画像リスト
forEach: リスト内の各要素に対して処理を実行する関数
item: リスト内の各要素
index: リスト内の各要素のインデックス番号
item.onmouseover = function () {

item: リスト内の各要素
onmouseover: マウスが要素の上に移動した時に発生するイベント
function: イベント発生時に実行される関数
ListItem.setAttribute('src', ImageList[index]);

ListItem: 画像要素
setAttribute: 要素の属性を設定する関数
src: 画像のソース
ImageList[index]: 画像リストのインデックス番号で指定された画像
つまり、このコードは以下の処理を実行します:

Lists内の各要素に対して、
マウスが要素の上に移動した時に、
ListItemsのsrc属性をImageListのインデックス番号で指定された画像に設定します。
例:

Lists = ["image1.jpg", "image2.jpg", "image3.jpg"];
ImageList = ["image1.png", "image2.png", "image3.png"];

このコードの場合、

マウスが "image1.jpg" の上に移動すると、ListItem の src 属性は "image1.png" に設定されます。
マウスが "image2.jpg" の上に移動すると、ListItem の src 属性は "image2.png" に設定されます。
マウスが "image3.jpg" の上に移動すると、ListItem の src 属性は "image3.png" に設定されます。
補足:

index を使用して、リスト内の各要素に個別にアクセスできます。
ImageList[index] は、index 番号の画像を取得します。
参考資料:

JavaScript forEach(): https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
JavaScript onmouseover: [[無効な URL を削除しました]]([無効な URL を削除しました])
JavaScript setAttribute(): https://developer.mozilla.org/ja/docs/Web/API/Element/setAttribute
■ このスレッドは過去ログ倉庫に格納されています