educative.io

Educative

Element.outerHTML

What is the output in this example?


Type your question above this line.

Course: https://www.educative.io/collection/10370001/5686791109607424
Lesson: https://www.educative.io/collection/page/10370001/5686791109607424/5735735550279680

Hi @masha the output will be

<h1 id="logo">Learn DOM Manipulation with Javascript</h1>

Thanks/
If so,

Learn DOM Manipulation with Javascript

where is the manipulating of Element.outerHTML?
Why not just let html tag do it’s work?
Can you give an example?

Hi @masha
We are using console.log("h1 element:", h1.outerHTML); which means it will show its output on console not on HTML page.

Like in this example:

document.querySelector('h1'); is responsible for printing Learn DOM Manipulation with Javascript while console.log("h1 element:", h1.outerHTML); is responsible for printing this on console.

h1 element:
<h1 id="logo">Learn DOM Manipulation with Javascript</h1>