Advertisement
Guest User

Untitled

a guest
Jul 20th, 2018
78
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.23 KB | None | 0 0
  1. // Restart Game Button
  2. var restart = document.querySelector('#b');
  3.  
  4. // Grab all the squares
  5. var squares = document.querySelectorAll("td");
  6.  
  7. var grid = document.querySelector("tr")
  8.  
  9. var x = document.getElementById("change").innerHTML;
  10.  
  11.  
  12.  
  13.  
  14. // Clear Squares Function
  15. function clearBoard() {
  16. for (var i = 0; i < squares.length; i++) {
  17. squares[i].textContent = '';
  18. }
  19.  
  20. }
  21. restart.addEventListener('click',clearBoard)
  22.  
  23.  
  24.  
  25.  
  26.  
  27. // Create a function that will check the square marker
  28.  
  29.  
  30.  
  31.  
  32. var header = document.querySelector("h1")
  33. var tablecolor = document.querySelector("td")
  34. // Then you can interface with the object.
  35.  
  36. // Interface with the style.
  37. //You will see a ton of options show up!
  38. //header.style.color = 'blue'
  39. //tablecolor.style.color = 'blue'
  40. //grid.style.color = 'red'
  41. // Now let's connect it to the script to
  42. // change it once every second to a random color!
  43.  
  44. // Random Color Function:
  45.  
  46. // http://stackoverflow.com/questions/1484506/random-color-generator-in-javascript
  47.  
  48. function getRandomColor(){
  49. var letters = "0123456789ABCDEF";
  50. var color = '#';
  51. for (var i = 0; i < 6; i++) {
  52. color += letters[Math.floor(Math.random()*16)];
  53. }
  54. return color
  55. }
  56. function changeMarker(){
  57. if(this.textContent === ''){
  58. this.textContent = 'X';
  59. // console.log(marker)
  60. }else if (this.textContent === 'X') {
  61. this.textContent = 'O';
  62. }else {
  63. this.textContent = '';
  64. }
  65. };
  66. // Simple function for clarity
  67. function changeHeaderColor(){
  68. colorInput = getRandomColor()
  69. header.style.color = colorInput;
  70. }
  71.  
  72. function changeBorderColor() {
  73. var table = document.getElementById("table_row").getElementsByTagName("td");
  74. for(var i=0; i<table.length; i++) {
  75. var td = table[i];
  76. td.style.borderColor = getRandomColor();
  77. }
  78. }
  79. // Use a for loop to add Event listeners to all the squares
  80. for (var i = 0; i < squares.length; i++) {
  81. squares[i].addEventListener('click', changeMarker);
  82. squares[i].style.color = getRandomColor()
  83. }
  84.  
  85. function changeXColor(){
  86. colorInput = getRandomColor();
  87. x.style.color = colorInput;
  88. }
  89.  
  90. setInterval("changeHeaderColor()",300);
  91. setInterval("changeBorderColor()",305);
  92. setInterval("changeXColor()",300);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement