Question

Every letter doesn’t have it’s own wrapper element, everything is inside paragraph.

And I am wondering if I can retrieve the position of the letter in string when I hover over it’s parent element?

For example: <p>The quick brown fox jumps over the lazy dog</p> has innerText.length = 43, if I hover over f, it should return 16.

Any way to do this?

Thanks in advance!

Answer 1

Options for you:

1. To use Canvas (HTML5) and in particular its
   context.measureText(text).width. But this will give
   you position in single line text.
2. To use cursor/range in contenteditable, see
   Get caret (cursor) position in contentEditable area containing HTML content for example.