「jQuery」forEachメソッドで配列に対す繰り返しを処理する
環境
Google Chrome 104.0.5112.81
jQuery 3.6.0
構文
配列名.forEach(function(element，index){
//配列に対する繰り返し処理コード
});
element
現在処理されている配列の要素です。
index
配列内の currentValue の添字です。
forEachを使って、配列の要素を繰り返して処理します。
forEach文のコールバック関数は「value」、「index」、「array」の3つの引数を受け取ることができます。
使用例
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#show").click(function(){
const dataArr = ["東京","大阪","福岡"];
dataArr.forEach(function(element,index){
alert(element+index);
});
});
});
</script>
</head>
<body>
<button id="show">表示</button>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#show").click(function(){
const dataArr = ["東京","大阪","福岡"];
dataArr.forEach(function(element,index){
alert(element+index);
});
});
});
</script>
</head>
<body>
<button id="show">表示</button>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#show").click(function(){
const dataArr = ["東京","大阪","福岡"];
dataArr.forEach(function(element,index){
alert(element+index);
});
});
});
</script>
</head>
<body>
<button id="show">表示</button>
</body>
</html>
実行結果
「表示」ボタンを押すと、「東京0」、「大阪1」、「福岡2」が表示されます。