Проблема выделения подстрок Javascript / jQuery

Question

Я использую Javascript для вычисления смещения и длины подстроки, выбранной на моей странице.Это сохраняется где-то и позже, когда я наведу курсор на текст, я хочу выделить в нем определенные слова, используя это смещение и длину в jQuery.Вот основной код, используемый для выделения:

content = $("#reader").html();
newContent = content.substring(0,offset)+'<font style="color: red;">'+content.substring(offset,offset+length)+'</font>'+content.substring(offset+length,content.length);
content = $("#reader").html(newContent);

Теперь моя проблема заключается в следующем: смещение и длина рассчитываются по тому, что отображается на экране.Однако фактический HTML-код также может содержать

или другие теги.В результате выделенный мною текст «сдвигается» в зависимости от количества присутствующего HTML-кода.

Какой самый простой способ решить эту проблему?

Answer 1

используйте

$ ("# reader"). Text ()

вместо $ ("# reader"). Html () для получения текставне вашего контента

Answer 2

Это не легко решаемо.Вы не должны вычислять смещение и длину по тексту, но по HTML, если вы хотите работать с HTML впоследствии.Однако вставка тегов HTML где-либо в существующую строку HTML может привести к неправильному вложению.И, наконец, вы теряете состояние, как прикрепленные обработчики событий, если повторно вставляете узлы в виде HTML-кода.

Answer 3

Я бы лишил теги или использовал бы методы DOM - как. .nodeType, .nodeValue.