I am using below HTML for my code.
<code> <body>
<div id="myId" class="oldClass">
This is the original content of the element with ID "myId".
</div>
</body>
</code>
<code> <body>
<div id="myId" class="oldClass">
This is the original content of the element with ID "myId".
</div>
</body>
</code>
<body>
<div id="myId" class="oldClass">
This is the original content of the element with ID "myId".
</div>
</body>
I am perform DOM Manipulation using below JavaScript Code:
<code>const myElement = document.getElementById('myId');
myElement.setAttribute('data-example', 'value');
console.log(myElement);
myElement.removeAttribute('data-example');
console.log(myElement);
</code>
<code>const myElement = document.getElementById('myId');
myElement.setAttribute('data-example', 'value');
console.log(myElement);
myElement.removeAttribute('data-example');
console.log(myElement);
</code>
const myElement = document.getElementById('myId');
myElement.setAttribute('data-example', 'value');
console.log(myElement);
myElement.removeAttribute('data-example');
console.log(myElement);
However, first console.log() statement is not displaying the data-example property.
<code><div id="myId" class="oldClass">
This is the original content of the element with ID "myId".
</div>
</code>
<code><div id="myId" class="oldClass">
This is the original content of the element with ID "myId".
</div>
</code>
<div id="myId" class="oldClass">
This is the original content of the element with ID "myId".
</div>
Note: I am trying to understand how the console works with the DOM elements.
3