js鼠标样式默认值

在JavaScript中，鼠标的默认样式通常是由浏览器根据元素的类型和状态自动设置的。例如，当鼠标悬停在一个链接上时，浏览器会自动将鼠标指针更改为手形（通常表示可以点击）。同样，当鼠标悬停在一个文本输入框上时，鼠标指针会变为一个垂直的竖线（通常表示可以输入文本）。

基础概念

CSS cursor 属性：这个属性允许开发者自定义鼠标指针的样式。例如，cursor: pointer; 会使鼠标指针看起来像一个手形，而 cursor: text; 会使鼠标指针看起来像一个垂直的竖线。
默认鼠标样式：如果不使用CSS cursor 属性，浏览器会根据元素的类型和状态自动设置鼠标指针的样式。

类型

常见的鼠标样式包括：

default：默认的箭头指针。
pointer：手形指针，通常用于表示可以点击的元素。
text：文本输入指针，通常用于表示可以输入文本的区域。
wait：等待指针，通常用于表示正在加载或处理数据。
move：移动指针，通常用于表示可以拖动的元素。
not-allowed：禁止指针，通常用于表示不允许的操作。

应用场景

导航菜单：使用 cursor: pointer; 来表示菜单项可以点击。
按钮：使用 cursor: pointer; 来表示按钮可以点击。
文本输入框：使用 cursor: text; 来表示可以输入文本。
禁用元素：使用 cursor: not-allowed; 来表示元素不可点击。

示例代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mouse Cursor Example</title>
    <style>
        .clickable {
            cursor: pointer;
        }
        .text-input {
            cursor: text;
        }
        .disabled {
            cursor: not-allowed;
            opacity: 0.5;
        }
    </style>
</head>
<body>
    <div class="clickable">Click Me!</div>
    <input type="text" class="text-input" placeholder="Type here...">
    <div class="disabled">Disabled Element</div>
</body>
</html>

在这个示例中：