Заставить HTML распознавать пользовательские теги ввода

Question

Привет всем, вы, удивительные умные люди,

Мне нужна помощь с пользовательским вводом. Я создаю базовый текстовый процессор, и мне нужно выделить определенную выделенную область жирным шрифтом. Пользователь выделит область мышью и нажмет кнопку. Затем компьютер заменит выделенный текст на <b>+originaltext+</b>якобы делая это жирным шрифтом. Проблема в том, что компьютер превращает открытую и закрытую морковь в < и, следовательно, мешает ему делать свою работу.

Как заставить компьютер передать его как настоящие жирные метки?

Вот что я делаю в основном:

function replaceSelectedText() {
var sel, range, txtstuff;
if (window.getSelection) {
    txtstuff = '<b>'+window.getSelection()+'</b>'
    sel = window.getSelection();
    alert(txtstuff, sel);
    if (sel.rangeCount) {
        range = sel.getRangeAt(0);
        range.deleteContents();
        range.insertNode(document.createTextNode(txtstuff));
    }
} else if (document.selection && document.selection.createRange) {
    range = document.selection.createRange();
    range.text = txtstuff;
}
}

Спасибо за любую помощь заранее!

ОБНОВЛЕНИЕ: Это в редактируемом div.

Answer 1

Рабочий код:

function replaceSelectedText() {
    var sel, range, txtstuff;
    if (window.getSelection) {
        txtstuff = '<b>'+window.getSelection()+'</b>'
        sel = window.getSelection();
        alert(txtstuff, sel);
        if (sel.rangeCount) {
            range = sel.getRangeAt(0);
            range.deleteContents();
            var b = document.createElement('b');
            b.innerHTML = txtstuff;
            range.insertNode(b);
        }
    } else if (document.selection && document.selection.createRange) {
        range = document.selection.createRange();
        range.text = txtstuff;
    }
}

Answer 2

Читайте о document.execCommand https://developer.mozilla.org/en-US/docs/Rich-Text_Editing_in_Mozilla

Синтаксис в вашем случае будет:

document.execCommand('bold');

Хотя это документация Mozilla, она очень кросс-браузерная. Это также не полагается на возможный ошибочный выбор курсора.