爲什麼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），爲什麼會出現這種情況

來源

2017-08-02 okmanl

你能可能創建一個[最小，完整，可驗證的示例]（http://stackoverflow.com/

通過選擇點擊廣場解決這個幫助/ MCVE）？ –

你有許多白色方形的元素。 '$（「。white_square」）.css（...）'只對文檔中的第一個操作。 [*「獲取匹配元素集合中**第一個元素**的計算樣式屬性。」*]（http://api.jquery.com/css/#css1） – Phil

在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")

來源

2017-08-02 10:47:39 trincot

爲什麼alert（$（「＃myHTMLElement」））顯示它的原始屬性，即使我已經通過事件對它進行了變異？

回答

相關問題