当前位置: 首页 > news >正文

JavaScript_Pig Game切换当前玩家

const current0El = document.getElementById('current--0');
const current1El = document.getElementById('current--1');
if (dice !== 1) {currentScore += dice;current0El.textContent = currentScore;} else {}
});

这是我们上个文章写的代码,这个代码明显是有问题的,当用户不等于1 ,当然分数累计的都是第一个用户,这个用户的累加应该是动态,当我们切换用户的时候,这个条件判断仍然有效

let activePlayer =0;

我们定义这样的一个变量,作用是什么呢?意思是如果为0的话,表示他就是当前的活跃用户

  if (dice !== 1) {currentScore += dice;document.getElementById( `current--${activePlayer}`).textContent = currentScore;current0El.textContent = currentScore;} else {player0El.classList.toggle('player--active');player1El.classList.toggle('player--active');}
});

这个代码就是,获取当前为0的用户,将他的当前分数赋值

● 然后如果是掷色子是1的话,我们要去判断如果活跃用户是0的话,就返回真的,返回真就会返回1,如果用户是1的话,就返回假的,将他置于0

activePlayer = activePlayer === 0 ? 1 : 0;

解释一下这个表达式的含义:
● 条件部分:activePlayer === 0,判断 activePlayer 是否等于 0。
● 如果条件为真(即 activePlayer 等于 0),则表达式返回 expression1,也就是 1。
● 如果条件为假(即 activePlayer 不等于 0),则表达式返回 expression2,也就是 0。
这样就巧妙的设置了activePlayer(活跃用户)的值了;也可以动态的给用户计算分数了
在这里插入图片描述

● 切换成功,但是我们还没有把活跃用户的当前分数置为0

  if (dice !== 1) {currentScore += dice;document.getElementById(`current--${activePlayer}`).textContent =currentScore;} else {activePlayer = activePlayer === 0 ? 1 : 0;currentScore = 0;}
});

● 但是真正的游戏规则是,当切换用户的话,当前的分数就为0了

  if (dice !== 1) {currentScore += dice;document.getElementById(`current--${activePlayer}`).textContent =currentScore;} else {document.getElementById(`current--${activePlayer}`).textContent = 0;currentScore = 0;activePlayer = activePlayer === 0 ? 1 : 0;}
});

在这里插入图片描述

当切换用户的时候,编程0
● 接着我们就来切换底色了,谁是活跃用户,谁的底色就是白色

const player0El = document.querySelector('.player--0');
const player1El = document.querySelector('.player--1');if (dice !== 1) {currentScore += dice;document.getElementById(`current--${activePlayer}`).textContent =currentScore;} else {document.getElementById(`current--${activePlayer}`).textContent = 0;currentScore = 0;activePlayer = activePlayer === 0 ? 1 : 0;player0El.classList.toggle('player--active');player1El.classList.toggle('player--active');}
});

在这里插入图片描述

当切换用户的时候,player2变成白色
注意:toggle是如果存在类就删除它,如果不存在就加上它,我们不需要去通过container去判断了

现在就查保持分数了,当玩家选择保持分数的时候,当前分数会被保存再上面大的总分当中!下个文章我们来展现它!

相关文章:

JavaScript_Pig Game切换当前玩家

const current0El document.getElementById(current--0); const current1El document.getElementById(current--1); if (dice ! 1) {currentScore dice;current0El.textContent currentScore;} else {} });这是我们上个文章写的代码,这个代码明显是有问题的&…...

EtherNet Ip工业RFID读写器与欧姆龙PLC 配置示例说明

一、准备阶段 POE交换机欧姆龙PLC 支持EtherNet Ip协议CX-Programmer 9.5配置软件 二、配置读卡器 1、打开软件 2、选择网卡,如果多网卡的电脑请注意对应所接的网卡,网卡名一般为“Network adapter Realtek PCIe GBE Family” 3、点击“选择网卡”&…...

UE5简化打包大小

UE5.3默认空项目带初学者包的打包后1G多 简化思路: 1.不打包初学者包(或者创建时不包括初学者包,跳过第一条) 导航:ProjectSettings->Project->Packaging->Packaging->Advanced->List of maps to incl…...

ThinkPHP8学习笔记

ThinkPHP8官方文档地址:ThinkPHP官方手册 一、composer换源 1、查看 composer 配置的命令composer config -g -l 2、禁用默认源镜像命令composer config -g secure-http false 3、修改为阿里云镜像源composer config -g repo.packagist composer https://mirror…...

NSSCTF做题第9页(2)

[SWPUCTF 2022 新生赛]ez_1zpop <?php error_reporting(0); class dxg { function fmm() { return "nonono"; } } class lt { public $impohi; public $md51weclome; public $md52to NSS; function __construct() { $this-&…...

Rust笔记【1】

元组和解构语法 let tup : (i32, f64, u8) (666, 2.0, 1);let tup (666, 2.0, 1); let (x, y, z) tup;let x tup.0; let y tup.1; let z tup.2;数组类型 数组定义是方括号&#xff1a;[ ] 元组定义是小圆括号&#xff1a;( ) 结构体定义是大括号&#xff1a;{ }&#xf…...

代码随想录训练营day3:链表part1

理论 链表的增删操作时间复杂度O(1),查询时间复杂度O(n),因为要从头结点开始。使用场景和数据完全相反 链表的储存地址是不连续的。也和数组不同。 移除链表元素 利用虚拟头结点可以同意操作。不然删除头结点需要额外写。 记得返回的是虚拟头结点的next而不是虚拟头结点retu…...

Bootstrap的咖啡网站实例代码阅读笔记

目录 01-index.html的完整代码02-图片可以通过类 rounded-circle 设置为圆形显示03-<li class"nav-item mt-1 a">中&#xff0c;类mt-1是什么意思&#xff1f;类a又是什么意思&#xff1f;04-href"javascript:void(0);"是什么意思&#xff1f;05-类f…...

2021年06月 Python(二级)真题解析#中国电子学会#全国青少年软件编程等级考试

Python等级考试&#xff08;1~6级&#xff09;全部真题・点这里 一、单选题&#xff08;共25题&#xff0c;每题2分&#xff0c;共50分&#xff09; 第1题 执行下列代码后&#xff0c;运行结果是&#xff1f; seq[hello,good,morning] s*.join(seq) print(s)A: hello*good*m…...

FileWriter文件字符输出流

一.概念 以内存为基准&#xff0c;把内存中的数据以字符形式写出到文件中 二.构造器 public FileWriter(Filefile) 创建字节输出流管道与源文件对象接通 public FileWriter(String filepath) 创建字节输出流管道与源文件路径接通 public Filewriter(File file,boolean append) …...

Vue的八个基础命令及作用

1.v-text 作用:获取data数据, 设置标签的内容&#xff0c;以纯文本进行显示v-text 会覆盖 标签中的内容&#xff0c;如果想要拼接数据&#xff0c;可以直接在v-text中拼接如果拼接的是数字&#xff1a;直接使用 “”如果拼接的是字符串&#xff0c;需要使用与外部不同的引号进…...

Log日志详解分析

目录 1、log日志的用途2、log日志级别3、什么时候需要输出日志1. 系统启动参数、环境变量2. 异常捕获处3. 函数获得期望之外的结果时4. 关键操作 4、日志输出的内容5、 注意事项1. 日志信息不明确2. 特殊异常处理3. 日志输出顺序4. 临时调试日志 6、xml文件配置7、linux下查看日…...

【API篇】九、Flink的水位线

文章目录 1、Flink时间语义2、事件时间和窗口3、水位线4、水位线和窗口的工作原理 1、Flink时间语义 事件时间处理时间 举个例子就是&#xff0c;一条数据在23:59:59产生&#xff0c;在00:00:01被处理&#xff0c;前者为事件时间&#xff0c;后者为处理时间。 从Flink1.12版本…...

#经典论文 异质山坡的物理模型 2 有效导水率

Binley, A., Beven, K., & Elgy, J. (1989). A physically based model of heterogeneous hillslopes: 2. Effective hydraulic conductivities. Water Resources Research, 25(6), 1227–1233. https://doi.org/10.1029/WR025i006p01227 这篇论文指出&#xff0c; 每个输…...

Java面试题-Redis-第一天(Redis简单介绍)

目录 一、Redis是什么&#xff1f;优缺点&#xff1f; 二、Redis为什么这么快&#xff1f; 三、Redis相较于Memcached有哪些优势&#xff1f; 四、为什么使用Redis做缓存&#xff1f; 五、为什么要用Redis而不用map/guava做缓存&#xff1f; 六、Redis的常用场景有哪些&am…...

Java 生成和读取JSON文件

下面的demo当中 &#xff0c;是将json文件放到了zip包当中。如果不需要&#xff0c;可以拿掉。 1、生成对象JSON文件 public static void crateJson() {try {String orcPath "D:\\doc\\ts_service_orchestration.json";// 对象集合或者对象都可以List<DataPO>…...

k8s-----26、细粒度权限管理 RBAC

0、导读 每一个用户对API资源进行操作都需要通经过以下三个步骤: 第一步:对客户端访问进行认证操作,确认是否具有访问k8s权限(也就是通过serviceaccount) token(共享秘钥) SSL(双向SSL认证) …通过任何一个认证即表示认证通过,进入下一步第二步:授权检查,确认是否对资源…...

【Unity ShaderGraph】| 制作一个 高级流体水球效果

前言 【Unity ShaderGraph】| 快速制作一个 流体水球效果一、效果展示二、简易流体水球效果三、进阶流体水球效果四、应用实例 前言 本文将使用ShaderGraph制作一个 高级流体水球 &#xff0c;可以直接拿到项目中使用。对ShaderGraph还不了解的小伙伴可以参考这篇文章&#xf…...

日常软件游戏丢失msvcp120dll怎么修复?分享5个修复方法

在计算机使用过程中&#xff0c;我们经常会遇到一些错误提示&#xff0c;其中之一就是“msvcp120dll丢失”。那么&#xff0c;究竟什么是msvcp120dll文件&#xff1f;当它丢失时&#xff0c;我们会遇到哪些问题呢&#xff1f;本文将从以下几个方面进行详细阐述。 msvcp120dll是…...

自动驾驶之—2D到3D升维

前言&#xff1a; 最近在学习自动驾驶方向的东西&#xff0c;简单整理一些学习笔记&#xff0c;学习过程中发现宝藏up 手写AI 3D卷积 3D卷积的作用&#xff1a;对于2DCNN&#xff0c;我们知道可以很好的处理单张图片中的信息&#xff0c;但是其对于视频这种由多帧图像组成的图…...

终极Mach-O文件分析指南:使用Bloaty深度剖析苹果应用大小

终极Mach-O文件分析指南&#xff1a;使用Bloaty深度剖析苹果应用大小 【免费下载链接】bloaty Bloaty: a size profiler for binaries 项目地址: https://gitcode.com/gh_mirrors/bl/bloaty Bloaty是一个强大的二进制文件大小分析工具&#xff0c;专门用于深度剖析可执行…...

musescore-downloader多语言支持解析:国际化i18n实现原理

musescore-downloader多语言支持解析&#xff1a;国际化i18n实现原理 【免费下载链接】musescore-downloader ⚠️ This repo has moved to https://github.com/LibreScore/dl-librescore ⚠️ | Download sheet music (MSCZ, PDF, MusicXML, MIDI, MP3, download individual p…...

OpenClaw+千问3.5-35B-A3B-FP8:24/7自动化内容审核方案

OpenClaw千问3.5-35B-A3B-FP8&#xff1a;24/7自动化内容审核方案 1. 为什么需要个人级内容审核方案 去年运营技术社区时&#xff0c;我每天要处理上百条用户生成内容。凌晨三点被举报消息吵醒的经历&#xff0c;让我开始寻找能替代人工初审的自动化方案。市面上的SaaS审核服…...

第6章 数据类型转换-6.7 转换为字典

通过使用dict()函数可以将列表或元组转换为字典。其语法格式如下&#xff1a;dict([x])其中&#xff0c;参数x为可选参数&#xff0c;表示列表或元组&#xff0c;且该列表或元组必须是键值对形式&#xff0c;如果省略该参数&#xff0c;则该函数返回空字典。示例代码如下&#…...

基于STM32F103的热电偶采集与PID温度控制系统设计方案——包含IAR开发环境下的STM...

STM32F103热电偶采集PID温控采集系统 基于stm32设计&#xff0c;可以实现热电偶采集&#xff0c;PID温度控制&#xff0c;注意51单片机源码基于keil开发环境&#xff0c;STM32源码基于IAR开发环境 提供原理图&#xff0c; PCB(AD格式)&#xff0c;源代码 &#xff0c;不提供&am…...

精准采集工程机械比例阀电流:IPEhub2+比例阀分流计实现PWM滤波与远程监控

自从“一带一路”和“新基建”计划被实施以来&#xff0c;工程机械的需求量呈现出快速增长的趋势&#xff0c;而关于工程机械&#xff0c;其比例阀控制问题不容忽视。比例阀是一种新型液压控制装置——在普通压力阀、流量阀和方向阀上&#xff0c;用比例电磁铁替代原有的控制部…...

绝区零一条龙:AI驱动的游戏体验革新工具

绝区零一条龙&#xff1a;AI驱动的游戏体验革新工具 【免费下载链接】ZenlessZoneZero-OneDragon 绝区零 一条龙 | 全自动 | 自动闪避 | 自动每日 | 自动空洞 | 支持手柄 项目地址: https://gitcode.com/gh_mirrors/ze/ZenlessZoneZero-OneDragon 在快节奏的现代生活中&…...

【单片机】STM32晶振引脚不连晶振时的做法

STM32不使用外部晶振时,OSC_IN和 OSC_OUT接法&#xff1a;1、对于100脚或者144脚的产品&#xff0c;OSC_IN应接地&#xff0c;OSC_OUT应悬空&#xff1b;2、对于少于100脚的产品&#xff0c;有两种接法&#xff1a;OSC_IN和OSC_OUT分别通过10K电阻接地&#xff0c;此方法可提高…...

收藏!小白/程序员轻松入门大模型,抓住AI风口高薪就业机会!

收藏&#xff01;小白/程序员轻松入门大模型&#xff0c;抓住AI风口高薪就业机会&#xff01; 本文详细介绍了AI大模型领域的热门就业岗位&#xff0c;包括AI模型研发工程师、数据科学家、算法工程师、AI应用开发工程师、AI平台架构师、AI产品经理和AI测试工程师等。文章强调了…...

SOLOv2的‘动态’内核与‘矩阵’NMS:深入代码看它如何比SOLO快3倍

SOLOv2动态内核与矩阵NMS的工程实现奥秘 在计算机视觉领域&#xff0c;实例分割一直是一个极具挑战性的任务&#xff0c;它要求模型不仅要检测出图像中的每个对象&#xff0c;还要精确地描绘出每个对象的轮廓。SOLO系列算法作为这一领域的创新者&#xff0c;从v1到v2的演进中展…...