Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial


Akhter Rasool
Akhter Rasool
8,597 Points

Text editor styling

How do I detect whether bold/italic/underline is turned on in a text editor or not so that I can indicate the user whether they are turned on or not? Also how do I know whether a selected text is bold/italic/ underlined or not ?

3 Answers

Not sure if I understand your question correctly, are you referring to a specific text editor?

In WYSIWYG html editors like TinyMCE, there are visual indicators (such as a different colored background) for when a user selects bold, italic etc. You can tell if text is bold, italic etc. because the editor converts text to HTML so bold text would be surrounded with strong tags, italic surrounded with em tags. Or they would have a CSS class applied to it (depends on the editor)

Can you provide some more context/ info on what are you trying to achieve?

Akhter Rasool
Akhter Rasool
8,597 Points

okay, here's what i want to say: how do i inform the user whether bold is selected or not ?

You could use an event, such as an 'on click' event, to call a function when the bold button is clicked. For example:


<button id="bold" href="#" onclick="isBold()">Bold</button>

<p id="informUser"></p>


function isBold() {
  document.getElementById("informUser").innerHTML = "Bold has been clicked";

Check out the Interactive web pages with Javascript course for more on events

Hope this helps :)