php
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="utf-8"> 5 <title>JavaScript Practice</title> 6 <style> 7 body{ 8 display:flex; 9 flex-wrap:wrap; 10 } 11 .box { 12 width: 100px; 13 height: 100px; 14 background: skyblue; 15 cursor: pointer; 16 transition:0.8s; 17 margin:0 8px 8px 0; 18 text-align:center; 19 line-height:100px; 20 } 21 .win{ 22 background:pink; 23 border-radius:50%; 24 transform:rotate(360deg); 25 } 26 .lose{ 27 transform:scale(0.9); 28 } 29 </style> 30</head> 31<body> 32 33 <script> 34 'use strict'; 35 const num = 5; 36 const winner = Math.floor(Math.random() * num); 37 for(let i = 0; i < num; i++){ 38 const div = document.createElement('div'); 39 div.classList.add('box'); 40 if( i === winner){ 41 div.dataset.result = 'win'; 42 }else{ 43 div.dataset.result = 'lose'; 44 } 45 46 div.addEventListener('click',function(){ 47 if(div.dataset.result === 'win'){ 48 div.textContent = 'win!'; 49 div.classList.add('win'); 50 }else{ 51 div.textContent = 'lose!'; 52 div.classList.add('lose'); 53 } 54 }); 55 56 document.body.appendChild(div); 57 58 } 59 60 </script> 61</body> 62</html>
javascriptで学習をしていたのですが、上記コードの「div.dataset.result = 'win';」の部分が、いまいち分からないです。「dataset.result 」は、なんなのでしょうか?
MDNを読んだのですが、いまいち分からなかった為、ご質問させて貰いました
追記です。
分からない部分の説明が不明確で申し訳ないです。
分からない部分についてなのですが、「dataset」が何で、「result」が何か、といった点が分からないです。
その後のif分での条件式で、使用されているということは、条件式などで、比較する為に設定する値?のようなものの、設定記法だったりするのでしょうか。
回答3件
あなたの回答
tips
プレビュー