打开 VSCode 自带的 Developer Tools 检查编辑器的元素，可以发现编辑器界面是由 div 元素组成的，一个 div 元素代表一行文本。当鼠标选择某一行时，这行的 div 会被添加 class ，展示不同的外观。那么点击这行后，一闪一闪的光标是怎么实现的？是靠动画吗？
This topic created in 888 days ago, the information mentioned may be changed or developed.
 |
iOCZSMay 31, 2024
1
我觉得是原生特性
|
 |
lschoMay 31, 2024
3
div 加 contenteditable 就可以输入啊
|
 |
elviscaiMay 31, 2024
4
|
 |
MossFoxMay 31, 2024
5
指的是光标那个视觉效果的话，闪烁效果是 JS 修改 CSS 控制的，位置是编辑器窗口里的绝对布局控制的，不在文本那一行 div 里面。
 |
 |
kealmMay 31, 2024
6
VSCode 的光标是模拟的，所以可以实现各种效果，不是浏览器原生的。
|
|
MossFoxMay 31, 2024
7
闪烁光标可以有多个，这样设计是很合理的，只要计算出位置就可以同时显示一堆。
试试按住鼠标中键在代码里面上下拖一下，看下那一批光标一起显示的效果。浏览器原生的光标做不到这种。 |
 |
DiamondYuanMay 31, 2024 via Android
8
vscode 是创建了一个隐藏的 input ，当你点击编辑器的时候，就会 focus 这个 input ，然后用 js 画一个光标出来。
所有的事件会被这个 input 捕获，通过一写计算后，计算出新 input 的位置，然后渲染出来。 |
Select Language