Advertisement
Guest User

Untitled

a guest
Aug 20th, 2019
103
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.46 KB | None | 0 0
  1. <div class="fruitsCalc">
  2. <div class="container">
  3. <div class="fruits" id="Apple" data-name="Apple" onclick="fruitClick()">Apple</div>
  4. <div class="fruits" id="Orange" data-name="Orange" onclick="fruitClick()">Orange</div>
  5. <div class="fruits" id="Apricot" data-name="Apricot" onclick="fruitClick()">Apricot</div>
  6. </div>
  7. <div class="container">
  8. <div class="fruits" id="Mandarin" data-name="Mandarin" onclick="fruitClick()">Mandarin</div>
  9. <div class="fruits" id="Stawberry" data-name="Stawberry" onclick="fruitClick()">Stawberry</div>
  10. <div class="fruits" id="Rastberry" data-name="Rastberry" onclick="fruitClick()">Rastberry</div>
  11. </div>
  12. <div class="result">
  13. <h2 style="text-align: center">RESULT:</h2>
  14. </div>
  15. </div>
  16.  
  17.  
  18.  
  19. let arr = [
  20. {title: 'Apple', val: "25 cal."},
  21. {title: 'Orange', val: "35 cal."},
  22. {title: 'Apricot', val: "45 cal."},
  23. {title: 'Mandarin', val: "55 cal."},
  24. {title: 'Stawberry', val: "65 cal."},
  25. {title: 'Rastberry', val: "75 cal."},
  26. ];
  27.  
  28. function fruitClick() {
  29. let result = document.querySelector('.result');/
  30. for (let i in fruitItem) {
  31.  
  32. let out = '';
  33. fruitItem[i].onclick = function () {
  34. for (let x in arr) {
  35. if (fruitItem[i].getAttribute('data-name') == arr[x].title) {
  36. out += `<p>${arr[x].val}</p>`;
  37. }
  38. }
  39. result.innerHTML = out;
  40. }
  41. }
  42. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement