JavaScript是一種非常強大的編程語言，它可以讓我們動態地改變網頁上的元素，包括CSS樣式。在CSS中，我們可以使用變量來保存特定的值，然后在不同的CSS規則中以變量名的形式使用它們。使用JavaScript來賦值CSS變量非常簡單，只需要使用“setProperty”方法即可。

//獲取元素
const element = document.querySelector('.my-element');
//獲取CSS變量
const cssVar = getComputedStyle(element).getPropertyValue('--my-var');
//設置CSS變量
element.style.setProperty('--my-var', 'new-value');

首先，我們需要使用“querySelector”方法獲取要操作的元素。在這個例子中，我們選擇了一個類名為“my-element”的元素。接下來，我們使用“getComputedStyle”方法獲取該元素的計算樣式，然后使用“getPropertyValue”方法來獲取我們的CSS變量的值。這個方法需要我們提供變量的名稱，所以我們將“-- my-var”作為參數傳入。

我們可以將獲取到的CSS變量的值存儲在一個變量中，然后使用“setProperty”方法來賦新值。這個方法需要三個參數：要設置的CSS屬性名稱、要設置的值和一個用來描述如何設置該屬性的可選參數。在這個例子中，我們將新的值設置為“new-value”，然后省略了第三個參數。

總的來說，使用JavaScript來賦值CSS變量是一種非常方便的方法，可以讓我們在網頁上實現非常動態的樣式效果。只需要跟隨這個簡單的模板，你就可以開始自己的CSS變量賦值之旅。