使用Javascript訪問DOM中的Element屬性值

Question

我正在嘗試訪問頁面中元素的屬性。 我的最終目標是，如果發生onClick事件，則將float屬性從左切換為右，反之亦然。 但是，我什至沒有訪問任何元素的運氣。

我試圖訪問width屬性只是為了測試並確保我的邏輯和代碼正常工作。 使用下面的代碼，我得到myElement2的“ null”返回值，並且還嘗試了myElement.style.getCSSPropertyVlaue函數，調試器說該函數不存在。

我正在使用Firefox調試器測試這是否有所作為。

var myElement = document.getElementById('leftPic');
var myElement2 = myElement.style.getPropertyValue('width');

console.log(myElement);
console.log(myElement2);
console.log('Test');

Answer 1

您使用了不正確的代碼來通過JavaScript獲取CSS屬性的值。 您要使用...

var myElement = document.getElementById('leftPic'),
var myElement2 = window.getComputedStyle(myElement).getPropertyValue('width');

另外，我會選擇一個更好的變量名稱來存儲寬度，因為myElement2具有誤導性。