Rock, Paper, Scissors<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n <script defer src=\"script.js\"><\/script>\n<\/head>\n<body>\n <label>\n <h1>Rock, Paper, Scissors<\/h1>\n\n <div class=\"container\">\n <div id=\"left\" class=\"hand\">\n <h2 id=\"p1Score\">Player: 0<\/h2>\n <i id=\"left-hand\" class=\"fa fa-hand-rock-o\"><\/i>\n <div id=\"shadow1\" class=\"shadow\"><\/div>\n <\/div>\n \n <div id=\"menu\">\n <ul>\n <li id=\"rock\" class=\"button\">Rock<\/li>\n <hr>\n <li id=\"paper\" class=\"button\">Paper<\/li>\n <hr>\n <li id=\"scissors\" class=\"button\">Scissors<\/li>\n <\/ul>\n <\/div>\n \n <div id=\"right\" class=\"hand\">\n <h2 id=\"p2Score\">CPU: 0<\/h2>\n <i id=\"right-hand\" class=\"fa fa-hand-rock-o\"><\/i>\n <div id=\"shadow2\" class=\"shadow\"><\/div>\n <\/div>\n <\/div>\n <h1 id=\"winner\">YOU WIN!<\/h1>\n <\/label>\n<\/body>\n\n<script>\n \/\/ Select buttons and elements\nconst rock = document.getElementById(\"rock\");\nconst paper = document.getElementById(\"paper\");\nconst scissors = document.getElementById(\"scissors\");\nconst rightHand = document.getElementById(\"right-hand\");\nconst leftHand = document.getElementById(\"left-hand\");\nconst shadow1 = document.getElementById(\"shadow1\");\nconst shadow2 = document.getElementById(\"shadow2\");\nconst p1 = document.getElementById(\"p1Score\");\nconst p2 = document.getElementById(\"p2Score\");\nconst winner = document.getElementById(\"winner\");\n\nlet p1Score = 0;\nlet p2Score = 0;\n\nrock.addEventListener(\"click\", () => playGame(\"rock\"));\npaper.addEventListener(\"click\", () => playGame(\"paper\"));\nscissors.addEventListener(\"click\", () => playGame(\"scissors\"));\n\nfunction cpuPick() {\n const choices = [\n \"fa fa-hand-rock-o\",\n \"fa fa-hand-paper-o\",\n \"fa fa-hand-scissors-o\"\n ];\n return choices[Math.floor(Math.random() * 3)];\n}\n\nfunction updateScores() {\n p1.textContent = `Player: ${p1Score}`;\n p2.textContent = `CPU: ${p2Score}`;\n}\n\nfunction checkWinner() {\n if (p1Score === 3) {\n winner.textContent = \"YOU WIN!\";\n winner.classList.add(\"gameover\");\n disableButtons();\n } else if (p2Score === 3) {\n winner.textContent = \"YOU LOSE!\";\n winner.classList.add(\"gameover\");\n disableButtons();\n }\n}\n\nfunction playGame(playerChoice) {\n leftHand.className = `fa fa-hand-${playerChoice}-o`;\n rightHand.className = cpuPick();\n\n const winnerLogic = {\n rock: { rock: 0, paper: -1, scissors: 1 },\n paper: { rock: 1, paper: 0, scissors: -1 },\n scissors: { rock: -1, paper: 1, scissors: 0 }\n };\n\n const cpuChoice = rightHand.className.split(\" \")[1].split(\"-\")[2];\n const result = winnerLogic[playerChoice][cpuChoice];\n\n if (result === 1) p1Score++;\n if (result === -1) p2Score++;\n\n updateScores();\n checkWinner();\n}\n\nfunction disableButtons() {\n rock.removeEventListener(\"click\", () => playGame(\"rock\"));\n paper.removeEventListener(\"click\", () => playGame(\"paper\"));\n scissors.removeEventListener(\"click\", () => playGame(\"scissors\"));\n}\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Rock, Paper, Scissors Rock, Paper, Scissors Player: 0 Rock Paper Scissors CPU: 0 YOU WIN!<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-templates\/template-pagebuilder-full-width.php","meta":{"_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","footnotes":""},"class_list":["post-5845","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/pages\/5845","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/comments?post=5845"}],"version-history":[{"count":44,"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/pages\/5845\/revisions"}],"predecessor-version":[{"id":5891,"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/pages\/5845\/revisions\/5891"}],"wp:attachment":[{"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/media?parent=5845"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\t\t

\n\t\t\t

<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\n \n \n Rock, Paper, Scissors<\/title>\n <link rel=\"stylesheet\" href=\"styles.css\">\n <script defer src=\"script.js\"><\/script>\n<\/head>\n<body>\n <label>\n <h1>Rock, Paper, Scissors<\/h1>\n\n <div class=\"container\">\n <div id=\"left\" class=\"hand\">\n <h2 id=\"p1Score\">Player: 0<\/h2>\n <i id=\"left-hand\" class=\"fa fa-hand-rock-o\"><\/i>\n <div id=\"shadow1\" class=\"shadow\"><\/div>\n <\/div>\n \n <div id=\"menu\">\n <ul>\n <li id=\"rock\" class=\"button\">Rock<\/li>\n <hr>\n <li id=\"paper\" class=\"button\">Paper<\/li>\n <hr>\n <li id=\"scissors\" class=\"button\">Scissors<\/li>\n <\/ul>\n <\/div>\n \n <div id=\"right\" class=\"hand\">\n <h2 id=\"p2Score\">CPU: 0<\/h2>\n <i id=\"right-hand\" class=\"fa fa-hand-rock-o\"><\/i>\n <div id=\"shadow2\" class=\"shadow\"><\/div>\n <\/div>\n <\/div>\n <h1 id=\"winner\">YOU WIN!<\/h1>\n <\/label>\n<\/body>\n\n<script>\n \/\/ Select buttons and elements\nconst rock = document.getElementById(\"rock\");\nconst paper = document.getElementById(\"paper\");\nconst scissors = document.getElementById(\"scissors\");\nconst rightHand = document.getElementById(\"right-hand\");\nconst leftHand = document.getElementById(\"left-hand\");\nconst shadow1 = document.getElementById(\"shadow1\");\nconst shadow2 = document.getElementById(\"shadow2\");\nconst p1 = document.getElementById(\"p1Score\");\nconst p2 = document.getElementById(\"p2Score\");\nconst winner = document.getElementById(\"winner\");\n\nlet p1Score = 0;\nlet p2Score = 0;\n\nrock.addEventListener(\"click\", () => playGame(\"rock\"));\npaper.addEventListener(\"click\", () => playGame(\"paper\"));\nscissors.addEventListener(\"click\", () => playGame(\"scissors\"));\n\nfunction cpuPick() {\n const choices = [\n \"fa fa-hand-rock-o\",\n \"fa fa-hand-paper-o\",\n \"fa fa-hand-scissors-o\"\n ];\n return choices[Math.floor(Math.random() * 3)];\n}\n\nfunction updateScores() {\n p1.textContent = `Player: ${p1Score}`;\n p2.textContent = `CPU: ${p2Score}`;\n}\n\nfunction checkWinner() {\n if (p1Score === 3) {\n winner.textContent = \"YOU WIN!\";\n winner.classList.add(\"gameover\");\n disableButtons();\n } else if (p2Score === 3) {\n winner.textContent = \"YOU LOSE!\";\n winner.classList.add(\"gameover\");\n disableButtons();\n }\n}\n\nfunction playGame(playerChoice) {\n leftHand.className = `fa fa-hand-${playerChoice}-o`;\n rightHand.className = cpuPick();\n\n const winnerLogic = {\n rock: { rock: 0, paper: -1, scissors: 1 },\n paper: { rock: 1, paper: 0, scissors: -1 },\n scissors: { rock: -1, paper: 1, scissors: 0 }\n };\n\n const cpuChoice = rightHand.className.split(\" \")[1].split(\"-\")[2];\n const result = winnerLogic[playerChoice][cpuChoice];\n\n if (result === 1) p1Score++;\n if (result === -1) p2Score++;\n\n updateScores();\n checkWinner();\n}\n\nfunction disableButtons() {\n rock.removeEventListener(\"click\", () => playGame(\"rock\"));\n paper.removeEventListener(\"click\", () => playGame(\"paper\"));\n scissors.removeEventListener(\"click\", () => playGame(\"scissors\"));\n}\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Rock, Paper, Scissors Rock, Paper, Scissors Player: 0 Rock Paper Scissors CPU: 0 YOU WIN!<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-templates\/template-pagebuilder-full-width.php","meta":{"_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","footnotes":""},"class_list":["post-5845","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/pages\/5845","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/comments?post=5845"}],"version-history":[{"count":44,"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/pages\/5845\/revisions"}],"predecessor-version":[{"id":5891,"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/pages\/5845\/revisions\/5891"}],"wp:attachment":[{"href":"https:\/\/www.weijia.io\/zh\/wp-json\/wp\/v2\/media?parent=5845"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}