javascript: Как я могу изменить свою функцию выбора выделения, чтобы не удалять лишние пробелы из первого элемента DOM в выделении?

Question

ОБНОВЛЕНИЕ: очевидно, проблема, с которой я столкнулся, касается только первого элемента в выделении.

JSFiddle: http://jsfiddle.net/NhQCR/

Мой код, который делает выбор с веб-страницы:

if (!window.TB) {
    TB = {};
}

TB.Selector = {};
// http://stackoverflow.com/questions/5643635/how-to-get-selected-html-text-with-javascript
// and
// http://stackoverflow.com/questions/7690319/javascript-how-do-i-expand-a-user-selection-based-on-html-tags
TB.Selector.getSelected = function() {
    var html = "";
    if (typeof window.getSelection != "undefined") {
        var sel = window.getSelection();
        if (sel.rangeCount) {
            var range = sel.getRangeAt(0);

            var startEl = sel.anchorNode;
            if (startEl != range.commonAncestorContainer) {
                while (startEl.parentNode != range.commonAncestorContainer) {
                    startEl = startEl.parentNode;
                }
            }
            var endEl = sel.focusNode;
            if (endEl != range.commonAncestorContainer) {
                while (endEl.parentNode != range.commonAncestorContainer) {
                    endEl = endEl.parentNode;
                }
            }
            range.setStartBefore(startEl);
            range.setEndAfter(endEl);

            sel.addRange(range);

            var container = document.createElement("div");
            container.appendChild(sel.getRangeAt(0).cloneContents());

            html = container.innerHTML;
        }
    } else if (typeof document.selection != "undefined") {
        if (document.selection.type == "Text") {
            html = document.selection.createRange().htmlText;
        }
    }
    return html;
}

и как я получаю выделенный текст:

        var selected_text = TB.Selector.getSelected();

к сожалению, как видно на рисунке, этот метод выделения текста удаляет определенные символы пробела и добавляет пустой div в конце выделения

Вот как выглядит выбор на веб-странице:

Для тех, кто интересуется: вот как я получил предупреждение, чтобы показать, что он делает:

start_index = $j(".text_container").html().indexOf($selected_text);
end_index = start_index + $selected_text.length;
alert(start_index + " to " + end_index + "\n" + $selected_text + "\n=====================================\n" + $j(".text_container").html());

В настоящее время код выбора расширит выбор, чтобы удостовериться, что нет несоответствующих тегов. Мне нужен код, который позволит мне получить именно то, что находится на веб-странице, без удаления / добавления чего-либо = \ Я просто не знаю с чего начать = \

Answer 1

Я не могу воспроизвести первый выпуск, «пустое пространство до 9», даже когда я его использую может быть связано с кодировками или маленькими зелеными парнями. В любом случае, все мои выборы начинаются с правильной точки.

Для второго выпуска <div></div> в конце просто замените

range.setEndAfter(endEl); 

от

range.setEndBefore(endEl);

Звучит как звук при выборе материала в массиве от 0 до длины -1.