Как горячими клавишами расположить курсор между дивом?

Question

[FavnAristotel]

Как с помощью горячих клавиш расположить курсор между дивом в его начале?
То есть после закрывающей первый див скобки <div>Здесь</div>

Answer 1

[Максим Самусевич]

Действительно неудобно, что при перемещении с помощью ctrl + ← и ctrl + → курсор проскакивает и не останавливается между угловыми скобками. По идее, он там останавливаться должен, т.к. в Preferences → Editor: Word Separators угловые скобки в списке символов есть.

Какой у вас сценарий использования, в котором возникает необходимость расположить курсор между тегами?

• Если такая необходимость возникает в процессе написания тега, то в VS Code есть встроенный плагин Emmet, который позволяет написать div, затем нажать tab, и код разворачивается в <div></div>, причём курс встаёт как раз между тегов.

• Если вам нужно поставить курсор между уже написанных ранее тегов, даже если между ними уже есть контент, включая другие вложенные теги, то можно сделать так: поставить курсор на любом символе открывающего или закрывающего тега, нажать Ctrl + Shift + P (вызов Command Palette), ввести emmet inward и выбрать появившуюся команду Emmet: Balance (inward) нажатием Enter или кликом по ней — тогда выделится всё содержимое тега, и далее вы можете нажать Backspace, чтобы стереть содержимое и написать новое, или можно нажать стрелку влево, и курсор встанет перед началом вложенного в тег контента.
Для удобства, чтобы каждый раз не делать это через Command Palette, можно повесить эту команду на хоткей: ещё раз вызвать Command Palette, в ней вы увидите недавно вызванную команду Emmet: Balance (inward), нажать на шестерёнку справа, в открывшемся окне будет строка с этой командой. Нужно кликнуть дважды в любом месте этой строки и ввести удобный вам хоткей, который не будет занят (например, Ctrl + '), или, если вам хочется эту команду повесить на уже занятый хоткей, можете ввести любой и переопределить хоткеи для других команд, которые занимают этот же желаемый хоткей.
Теперь будет удобно поставив курсор на любом символе открывающего или закрывающего тега, нажать хоткей, и курсор прыгнет внутрь тега

• Есть ещё вариант, чтобы перемещать курсор так, чтобы он вставал только между пустыми тегами (этот способ изначально описан в этом посте на Stackoverflow):
- установить плагин Select by
- на странице плагина нажать шестерёнку → Settings → в пункте Selectby: Regexes нажать Edit in settings.json
- внутрь

"selectby.regexes": {
       
    }

между фигурных скобок добавить

"goToEmpty": {
            "moveby": "<([^\\s]+).*?>(?=<\\/\\s?\\1)|\"(?=\")"
        }

- закрыть эти настройки
- зайти в File → Preferences → Keyboard Shortcuts и в правом верхнем углу открывшейся страницы нажать на иконку с файлом и стрелочкой, она подписана как Open Keyboard Shortcuts (JSON)
- после последней фигурной скобки поставить запятую и с новой строки вставить код

{
        "key": "ctrl+alt+right",
        "command": "moveby.regex",
        "args": ["goToEmpty", "moveby", "next", "end", "wrap"],
        "when": "editorTextFocus && editorLangId == html"
    },
    {
        "key": "ctrl+alt+left",
        "command": "moveby.regex",
        "args": ["goToEmpty", "moveby", "prev", "end", "wrap"],
        "when": "editorTextFocus && editorLangId == html"
    }

- выйти из файла
- теперь можно по хоткеям ctrl + alt + ← и ctrl + alt + → перемещаться курсором именно внутрь пустых тегов типа <div></div>, но это если тег совсем пустой, а если внутри уже что-то есть, этот способ не подойдёт, и лучше воспользоваться предыдущим)

Напишите, помогли ли вам эти способы, которые я предложил)

Answer 2

[Монитор]

https://htmlbook.ru/css/cursor
https://htmlbook.ru/html/button/accesskey

или javascript или библиотеками.