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;数组类型 数组定义是方括号:[ ] 元组定义是小圆括号:( ) 结构体定义是大括号:{ }…...
代码随想录训练营day3:链表part1
理论 链表的增删操作时间复杂度O(1),查询时间复杂度O(n),因为要从头结点开始。使用场景和数据完全相反 链表的储存地址是不连续的。也和数组不同。 移除链表元素 利用虚拟头结点可以同意操作。不然删除头结点需要额外写。 记得返回的是虚拟头结点的next而不是虚拟头结点retu…...
Bootstrap的咖啡网站实例代码阅读笔记
目录 01-index.html的完整代码02-图片可以通过类 rounded-circle 设置为圆形显示03-<li class"nav-item mt-1 a">中,类mt-1是什么意思?类a又是什么意思?04-href"javascript:void(0);"是什么意思?05-类f…...
2021年06月 Python(二级)真题解析#中国电子学会#全国青少年软件编程等级考试
Python等级考试(1~6级)全部真题・点这里 一、单选题(共25题,每题2分,共50分) 第1题 执行下列代码后,运行结果是? seq[hello,good,morning] s*.join(seq) print(s)A: hello*good*m…...
FileWriter文件字符输出流
一.概念 以内存为基准,把内存中的数据以字符形式写出到文件中 二.构造器 public FileWriter(Filefile) 创建字节输出流管道与源文件对象接通 public FileWriter(String filepath) 创建字节输出流管道与源文件路径接通 public Filewriter(File file,boolean append) …...
Vue的八个基础命令及作用
1.v-text 作用:获取data数据, 设置标签的内容,以纯文本进行显示v-text 会覆盖 标签中的内容,如果想要拼接数据,可以直接在v-text中拼接如果拼接的是数字:直接使用 “”如果拼接的是字符串,需要使用与外部不同的引号进…...
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时间语义 事件时间处理时间 举个例子就是,一条数据在23:59:59产生,在00:00:01被处理,前者为事件时间,后者为处理时间。 从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 这篇论文指出, 每个输…...
Java面试题-Redis-第一天(Redis简单介绍)
目录 一、Redis是什么?优缺点? 二、Redis为什么这么快? 三、Redis相较于Memcached有哪些优势? 四、为什么使用Redis做缓存? 五、为什么要用Redis而不用map/guava做缓存? 六、Redis的常用场景有哪些&am…...
Java 生成和读取JSON文件
下面的demo当中 ,是将json文件放到了zip包当中。如果不需要,可以拿掉。 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制作一个 高级流体水球 ,可以直接拿到项目中使用。对ShaderGraph还不了解的小伙伴可以参考这篇文章…...
日常软件游戏丢失msvcp120dll怎么修复?分享5个修复方法
在计算机使用过程中,我们经常会遇到一些错误提示,其中之一就是“msvcp120dll丢失”。那么,究竟什么是msvcp120dll文件?当它丢失时,我们会遇到哪些问题呢?本文将从以下几个方面进行详细阐述。 msvcp120dll是…...
自动驾驶之—2D到3D升维
前言: 最近在学习自动驾驶方向的东西,简单整理一些学习笔记,学习过程中发现宝藏up 手写AI 3D卷积 3D卷积的作用:对于2DCNN,我们知道可以很好的处理单张图片中的信息,但是其对于视频这种由多帧图像组成的图…...
conda相比python好处
Conda 作为 Python 的环境和包管理工具,相比原生 Python 生态(如 pip 虚拟环境)有许多独特优势,尤其在多项目管理、依赖处理和跨平台兼容性等方面表现更优。以下是 Conda 的核心好处: 一、一站式环境管理:…...
日语AI面试高效通关秘籍:专业解读与青柚面试智能助攻
在如今就业市场竞争日益激烈的背景下,越来越多的求职者将目光投向了日本及中日双语岗位。但是,一场日语面试往往让许多人感到步履维艰。你是否也曾因为面试官抛出的“刁钻问题”而心生畏惧?面对生疏的日语交流环境,即便提前恶补了…...
【杂谈】-递归进化:人工智能的自我改进与监管挑战
递归进化:人工智能的自我改进与监管挑战 文章目录 递归进化:人工智能的自我改进与监管挑战1、自我改进型人工智能的崛起2、人工智能如何挑战人类监管?3、确保人工智能受控的策略4、人类在人工智能发展中的角色5、平衡自主性与控制力6、总结与…...
调用支付宝接口响应40004 SYSTEM_ERROR问题排查
在对接支付宝API的时候,遇到了一些问题,记录一下排查过程。 Body:{"datadigital_fincloud_generalsaas_face_certify_initialize_response":{"msg":"Business Failed","code":"40004","sub_msg…...
Android Bitmap治理全解析:从加载优化到泄漏防控的全生命周期管理
引言 Bitmap(位图)是Android应用内存占用的“头号杀手”。一张1080P(1920x1080)的图片以ARGB_8888格式加载时,内存占用高达8MB(192010804字节)。据统计,超过60%的应用OOM崩溃与Bitm…...
论文笔记——相干体技术在裂缝预测中的应用研究
目录 相关地震知识补充地震数据的认识地震几何属性 相干体算法定义基本原理第一代相干体技术:基于互相关的相干体技术(Correlation)第二代相干体技术:基于相似的相干体技术(Semblance)基于多道相似的相干体…...
短视频矩阵系统文案创作功能开发实践,定制化开发
在短视频行业迅猛发展的当下,企业和个人创作者为了扩大影响力、提升传播效果,纷纷采用短视频矩阵运营策略,同时管理多个平台、多个账号的内容发布。然而,频繁的文案创作需求让运营者疲于应对,如何高效产出高质量文案成…...
JVM虚拟机:内存结构、垃圾回收、性能优化
1、JVM虚拟机的简介 Java 虚拟机(Java Virtual Machine 简称:JVM)是运行所有 Java 程序的抽象计算机,是 Java 语言的运行环境,实现了 Java 程序的跨平台特性。JVM 屏蔽了与具体操作系统平台相关的信息,使得 Java 程序只需生成在 JVM 上运行的目标代码(字节码),就可以…...
CSS | transition 和 transform的用处和区别
省流总结: transform用于变换/变形,transition是动画控制器 transform 用来对元素进行变形,常见的操作如下,它是立即生效的样式变形属性。 旋转 rotate(角度deg)、平移 translateX(像素px)、缩放 scale(倍数)、倾斜 skewX(角度…...
R 语言科研绘图第 55 期 --- 网络图-聚类
在发表科研论文的过程中,科研绘图是必不可少的,一张好看的图形会是文章很大的加分项。 为了便于使用,本系列文章介绍的所有绘图都已收录到了 sciRplot 项目中,获取方式: R 语言科研绘图模板 --- sciRplothttps://mp.…...
