Changing Text Of HTML Elements With Javascript

While developing with JavaScript, I talked about the printing methods used to display command results on the screen.

change html elements text with javascript — Changing Text Of HTML Elements With Javascript

Screen printing process;

Printing to HTML objects - innerHTML,
Print to HTML page - document.write (),
Print to alert window - alert (),
Print to browser console - console.log ()

Using innerHTML

Usually the document.getElementById (ID) method is used to select HTML objects with JavaScript .

After the selection process, we can change the content of the selected HTML object with the innerHTML property.

<p id="p1"></p>

<script>
  document.getElementById("p1").innerHTML = "Hello Sir Node!";
</script>

Using document.write ()

The document.write () method is used to test JavaScript commands and quickly print the results on the screen .

<p>This is a paragraph</p>

<script>
  document.write("Hello Sir Node!");
</script>

If the document.write () method is used as a result of an event, all HTML elements in the number will be deleted.

    <p>This is a paragraph</p>

    <button onclick="document.write('Hello Sir Node')">Click here</button>

Using alert ()

The alert () method is used to screen the JavaScript data as a warning message .

<p>This is a paragraph</p>

<script>
  alert("Hello Sir Node");
</script>

Using console.log ()

You can use console.log () to display operations on JavaScript Arrays, Objects or to make written commands more efficient and print them on the screen .

<p>This is a paragraph</p>

<script>
  console.log("Hello Sir Node");
</script>

Note:Console Display section of your browser must be active to see the result.

You can find the other Sir Node JavaScript Tutorials here…

If you want to learn more details about javascript, you can go here.

If you want to download a code editor(Visual Studio Code), you can go here.