~4 Modifying the Element HTML~
11/11/2024
Now let’s say we wanted to actually use some CSS element, where we need to use a few angle braces. For example, we wanted to us a <span> tag, or a <strong> tag, well if we were to do things in our JavaScript file the way that we had in the last tutorial, you would find all those irritating angle braces would be printed to the screen also. Now how infuriating would that mess be. You could use innerText or textContent, and they would both show you the markup on the web page.
innerHTML
Don’t worry, we do have a fix for that. Instead of using those other two options in JavaScript, we must specifically tell JavaScript that we are writing in HTML, and we want thing to work in the exact same way that it works when we work in the HTML, which means we will write tags, but we do not want our tags showing on our webpages.
Warning, if you were attempting to write that same line again, but instead leave the <strong> tag off, you would be writing over your original text. That is because you are using assignment here. And the last thing that you assign it innerHTML will be what is displayed on the screen.
Additionally, innerHTML could cause some security concerns, because it’s use could allow users to manipulate your code. If they were tech savvy enough to do so.
Steps to Creating a Strong Element in JavaScript
This is a more secure way of doing this, as opposed to using the method above.
- createElement assign it to the constant strong
- Set strong to work on your inner text
- Append this new text to your web page so it can be seen.
We did use a /n to represent a new line for our second line of text, so it would not be squished together on the first line
