我使用 HTML、CSS 和 javascript 撰寫了一個簡單的連接四種風格的游戲。該游戲在 Chrome 中功能齊全，但在使用 Firefox 瀏覽器時出現了一些有趣的行為。
在火狐瀏覽器中，當玩家掉落棋子時，游戲板的顏色會成功改變，但是，當我在檢查玩家是否獲勝時進行比較操作時，火狐瀏覽器并沒有檢測到任何顏色。
我試圖解決這個問題是通過宣告一個特定的 rgb 值，而不是僅僅說“紫色”，我做了類似下面的事情，得到了類似的結果。
這只是我的 javascript 代碼的相關部分：
const _purple = "rgb(124, 0, 132)";
columns[id][5 - pcs[id]].style.background = _purple; // assignment works always
columns[id][5 - pcs[id]].style.background = 'green'; // assignment like this ok too
if (columns[_col][_row].style.background == _purple) // only works in Chrome
if (columns[_col][_row].style.background == 'green') // only works in Chrome
我也嘗試===按照朋友的建議使用。
***** 更新 ***** 我檢查了控制臺以查看第一條評論中建議的 Firefox 回傳的內容，并且 Firefox 似乎回傳了正確的值。
rgb(124, 0, 132) none repeat scroll 0% 0%
green none repeat scroll 0% 0%
但是比較操作永遠不會回傳真。我試圖只使用整個字串，但這也不起作用。
正如預期的那樣，在 Chrome 上，如果我只是使用
"rgb(124, 0, 132)"而不是_purple
它也會回傳 true。
如果對解決此問題有任何幫助，我在游戲板中使用的 CSS 元素是：
.box {
background: white;
border: 2px solid black;
}
更遠：
Visual Studio 向我報告說“型別字串上不存在屬性顏色”。呼叫以console.log(first.style.background.color);回報undefined在我的Firefox控制臺，而呼叫console.log(second.style.background);回傳正確的RGB值。當比較 undefined.color值時它回傳true，但是false當比較 .background 屬性時它回傳，這確實是 rgb 值
感謝您對此問題的任何幫助，可以在此處查看游戲和糾正此錯誤的嘗試https://github.com/paolo-Rancati/four_in_a_sequence/tree/main/snippet
uj5u.com熱心網友回復：
您可以使用 解決此問題computedStyle，顯然您擁有的 rgb 值"rgb(124, 0, 132)"與 FireFox 使用的值不對應purple。
const _purple = "rgb(128, 0, 128)";
let first = document.getElementById("first");
let second = document.getElementById("second");
const spaces = document.querySelectorAll('.box');
first.style.background = "purple";
second.style.background = _purple;
console.log(window.getComputedStyle(first).backgroundColor);
console.log(window.getComputedStyle(second).backgroundColor);
console.log(window.getComputedStyle(first).backgroundColor === window.getComputedStyle(second).backgroundColor);div {
width: 100%;
height: 50px;
border: 1px solid black;
}
.box {
background: white;
border: 2px solid black;
}<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"></html>
<head>
<link rel="stylesheet" href="static/website.css">
<meta charset="utf-8" />
<title>Game Page</title>
</head>
<div id="first"></div>
<div id="second"></div>
</html>uj5u.com熱心網友回復：
但是為什么要測驗單元格的顏色？您應該擁有一個存盤板狀態的陣列，并測驗陣列中的值！我知道這不能回答你的問題，但你有一個XY 問題。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/353705.html
標籤：javascript html css 火狐
上一篇：Jenkins多分支流水線Blue Ocean的安裝和使用
下一篇：CM-BERT: Cross-Modal BERT for Text-Audio Sentiment Analysis 閱讀筆記