設置背景div標籤的大小不能使用Javascript

Question

我需要在動畫過程中更改背景圖像的大小，但它不起作用。

這裏是我的代碼一個簡單的版本：

document.querySelector("#Box").backgroundSize='cover';

#Box { 
 
\t \t background-image: url(https://beebom-redkapmedia.netdna-ssl.com/wp-content/uploads/2016/01/Reverse-Image-Search-Engines-Apps-And-Its-Uses-2016.jpg); 
 
\t \t width: 220px; 
 
\t \t height: 220px; 
 
    }

<div id="Box"></div>

Answer 1

您應針對.style

document.querySelector("#Box").style.backgroundSize='cover';

#Box { 
 
\t \t background-image: url(https://beebom-redkapmedia.netdna-ssl.com/wp-content/uploads/2016/01/Reverse-Image-Search-Engines-Apps-And-Its-Uses-2016.jpg); 
 
\t \t width: 220px; 
 
\t \t height: 220px; 
 
    }

<div id="Box"></div>

Answer 2

你在你的查詢選擇

document.querySelector("#Box").style.backgroundSize='cover';

#Box { 
 
\t \t background-image: url(https://beebom-redkapmedia.netdna-ssl.com/wp-content/uploads/2016/01/Reverse-Image-Search-Engines-Apps-And-Its-Uses-2016.jpg); 
 
\t \t width: 220px; 
 
\t \t height: 220px; 
 
    }

<div id="Box"></div>

Answer 3

只是缺少從你的js style ...

document.querySelector("#Box").style.backgroundSize='cover';

#Box { 
 
\t \t background-image: url(https://beebom-redkapmedia.netdna-ssl.com/wp-content/uploads/2016/01/Reverse-Image-Search-Engines-Apps-And-Its-Uses-2016.jpg); 
 
\t \t width: 220px; 
 
\t \t height: 220px; 
 
    }

<div id="Box"></div>

Answer 4

的#Box元素缺少.style聲明沒有backgroundSize屬性。你應該只參考它的風格屬性，然後到backgroundSize

document.querySelector("#Box").style.backgroundSize = 'cover'