如何獲取 css 屬性並通過 javascript 更改 html 元素的高度

Question

我嘗試創建一個 div 元素並從 CSS 選擇器讀取高度。 最后通過 javascript 更改 div 元素高度。 當我使用div.style.height ='15px'; 工作正常，但我想動態改變高度，因為我的 CSS class 將通過響應 function 改變。

我的 CSS 是：

    #indicator {
        width: 15px;
        height: 15px;
    }

我將此代碼用於腳本：

 div = document.createElement("div");// valve_indicator
 div.style.border = '1px solid #b3280a';

 div.style.height =document.getElementById('indicator').style.height; // instead div.style.height ='15px';
 div.style.width = '15px';
 cell.appendChild(div); // cell is a table cell

但是document.getElementById('indicator').style.height返回 null。 請幫助我提前謝謝

Answer 1

刪除#indicator中的# 。 getElementById()在 id 名稱前不需要#符號

document.getElementById('indicator').style.height

如果您想動態更改indicator height ：

let indicator = document.getElementById('indicator');
indicator.addEventListener("change", function(){
    div.style.height = indicator.style.height;
}) 

Answer 2

我通過使用此代碼解決了我的問題

div.className='indicator';