为什么alert($(“#myHTMLElement”))显示它的原始属性,即使我已经通过事件对它进行了变异?
问题描述:
我有这个功能是应该创建一个花纹板。
function createBoard() {
let strHTML = "";
let alphabets = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
for (var row = 0; row < 8; row++) {
strHTML += "<div>";
for (var column = 0; column < 8; column++) {
if ((column + row) % 2 === 0) {
strHTML +=
`<div class="white_square" id="${alphabets[column]}${8-row}" onclick="test()"></div>`;
}
}
// .... omitted some code for clarity
};
这是将白色方块的css背景颜色“改变”为绿色的功能。
$("#blackPawn").click(function() {
createBoard();
$("#a6").css("background-color", "green");
alert($("#a6").css("background-color"));
});
这是当单击正方形时被调用的函数。如果广场是绿色的,它应该说类似“恭喜”,否则它只会说它是一个白色方形。
function test() {
if ($(".white_square").css("background-color") === "rgb(0, 128, 0)") {
alert("good job eric");
} else {
var k = $(".white_square").css("background-color");
alert(k);
}
}
线
alert($("#a6").css("background-color"));
指出, “#A6” 的背景色属性现在具有值“RGB(0,128,0)。然而,当我点击该正方形触发测试()函数,它说,它的值是RGB(255,255,255),为什么会出现这种情况
答
在jQuery css
method的文档解释(重点煤矿):?
得到一个计算样式属性的值对于第一元件集合中匹配的元素[...]
虽然a6
是.white_square
,它不是第一个。而在这里,你真的只检查第一个的背景色:
$(".white_square").css("background-color") === "rgb(0, 128, 0)"
,并在随后的alert
。
$(this).css("background-color")
或:
$(ev.target).css("background-color")
你能可能创建一个[最小,完整,可验证的示例](http://*.com/
通过选择点击广场解决这个帮助/ MCVE)? –
你有许多白色方形的元素。 '$(“。white_square”).css(...)'只对文档中的第一个操作。 [*“获取匹配元素集合中**第一个元素**的计算样式属性。”*](http://api.jquery.com/css/#css1) – Phil