JS是一門非常常用的語言，很多網(wǎng)頁上都用JS來實現(xiàn)鼠標懸停改變CSS屬性，這些效果可以讓網(wǎng)頁更加美觀，吸引用戶的眼球。接下來的代碼演示就是介紹如何通過JS來實現(xiàn)鼠標經(jīng)過改變CSS的效果。

//獲取需要修改的元素
let box = document.getElementById('box');
//為元素綁定鼠標經(jīng)過事件
box.onmouseover = function(){
	//改變元素的CSS屬性
	this.style.backgroundColor = 'red';
	this.style.color = 'white';
};
//為元素綁定鼠標離開事件
box.onmouseout = function(){
	//恢復元素的CSS屬性
	this.style.backgroundColor = '#fff';
	this.style.color = '#000';
};

以上代碼中，我們通過getElementById獲得了要修改CSS屬性的元素box，然后為其綁定了onmouseover和onmouseout事件，這兩個事件可以分別處理鼠標經(jīng)過和鼠標離開時的效果。這樣，在用戶鼠標經(jīng)過box元素時，就會觸發(fā)onmouseover事件，這時我們就可以通過修改元素的style屬性來改變它的背景顏色和文字顏色。同理，在用戶鼠標離開box元素時，就會觸發(fā)onmouseout事件，我們需要在此時再次恢復元素的CSS屬性，使其恢復原貌。

通過JS來實現(xiàn)鼠標經(jīng)過改變CSS的效果，可以使網(wǎng)頁看起來更加舒服美觀。而我們只需要幾行JS代碼就能實現(xiàn)這個效果，非常的方便簡單。