Cómo obtener el elemento seleccionado dentro de un elemento contenteditable

Lo que he intentado

Revisé esta pregunta , y este , el problema es que me da el contenido de la selección actual, pero quiero el elemento dom en su lugar.


Lo que quiero hacer

Estoy buscando una forma de obtener el nombre de un elemento que actualmente se está editando con javascript. Por ejemplo:

Some List

  • Item 1
  • Item *caret here* 2
  • Item 3

Quiero poder poner el elemento de la lista en una variable de javascript el . Así que yo puedo hacer por ejemplo:

 el.tagName el.className 

¿Alguien sabe como lograr esto? Tx 🙂

Puede usar un Rango para referirse a la parte seleccionada del documento y luego revisar el commonAncestorContainer para recuperar el

    .
    En su ejemplo, si selecciona parte de la lista, puede recuperar el

      con algo como:

        var sel = window.getSelection(); var range = sel.getRangeAt(0); var ulTag = range.commonAncestorContainer; 

      Si, en cambio, desea obtener el elemento señalado por el cursor (sin que haya una selección), puede referirse a la propiedad startContainer y luego revisar el parentNode para recuperar el

    • . Por ejemplo:

        var sel = window.getSelection(); var range = sel.getRangeAt(0); var pointedLiTag = range.startContainer.parentNode; 

      Tenga en cuenta que estos son solo casos de uso simples, en documentos reales hay muchos elementos nesteds, por lo que debe asegurarse de que el elemento que recupere sea el que espera antes de usarlo.