Javascript - Как переключить элемент в contenteditable как execCommand?

Question

Я хочу, чтобы переключить B тег, если выбран:

<div contenteditable="true"> 
<p><b>Zeffer !</b></p> 
</div> 
<button id="bold">Bold</button> 

Answer 1

Вы можете просто добавить click event listener к кнопке, которая выполняет execCommand.

var bold = document.getElementById('bold'); 

bold.addEventListener('click', function() { 
    document.execCommand('bold', false, null); 
}); 

При выборе текста внутри contenteditable DIV, а затем нажав на кнопку, она будет переключать либо полужирный или не полужирный; в зависимости от его текущего состояния.

См. this fiddle для живой демонстрации.