JavaScript 可以通過修改網頁中元素的樣式來實現改變鼠標形狀的效果。比如，當鼠標移動到某個鏈接上時，我們可以通過 JavaScript 動態地修改鏈接的樣式，從而改變鏈接下劃線的顏色、字體大小等，從而實現鼠標懸浮鏈接時鼠標形狀的變化。
// 假設頁面上有一個鏈接元素，其 ID 為 link const link = document.querySelector('#link'); link.addEventListener('mouseenter', function() { // 鼠標移入鏈接時，修改下劃線顏色和字體大小 this.style.textDecorationColor = 'red'; this.style.fontSize = '16px'; }); link.addEventListener('mouseleave', function() { // 鼠標移出鏈接時，還原下劃線顏色和字體大小 this.style.textDecorationColor = 'blue'; this.style.fontSize = ''; });
除了懸浮鏈接時修改下劃線顏色和字體大小，我們還可以通過改變鼠標指針圖標的方式來實現變化鼠標形狀的效果。例如鼠標移動到一幅圖片上時，我們可以將鼠標指針的圖標修改成放大鏡，從而提示用戶點擊圖片進行查看。
// 假設頁面上有一個圖片元素，其 ID 為 image const image = document.querySelector('#image'); image.addEventListener('mouseenter', function() { // 鼠標移入圖片時，修改指針圖標為放大鏡 this.style.cursor = 'zoom-in'; }); image.addEventListener('mouseleave', function() { // 鼠標移出圖片時，還原指針圖標 this.style.cursor = ''; });
不僅如此，我們還可以根據不同的操作提示用戶不同的鼠標指針圖標。比如，當鼠標移動到文本輸入框時，我們可以將鼠標指針的圖標修改成 I 形狀，從而提示用戶可以在輸入框內輸入內容。
// 假設頁面上有一個文本輸入框元素，其 ID 為 input
const input = document.querySelector('#input');
input.addEventListener('mouseenter', function() {
// 鼠標移入文本輸入框時，修改指針圖標為 I 形狀
this.style.cursor = 'text';
});
input.addEventListener('mouseleave', function() {
// 鼠標移出文本輸入框時，還原指針圖標
this.style.cursor = '';
});總之，通過 JavaScript 修改網頁中元素的樣式，我們可以輕松地實現改變鼠標形狀的效果。這種效果常用于網頁交互設計中，可以為用戶提供良好的用戶體驗，同時增強網頁的交互性和可操作性。
上一篇java框架的下載和安裝
下一篇python畫總分均分線