Difference between revisions of "DOM Changing elements"
Jump to navigation
Jump to search
Line 1: | Line 1: | ||
< | <textarea id='shellbody' data-qtp='DOM' lang=html> | ||
<div id='countries'> | <div id='countries'> | ||
<div id='fr'> | <div id='fr'> | ||
Line 10: | Line 10: | ||
</div> | </div> | ||
</div> | </div> | ||
</ | </textarea> | ||
==Create Content== | ==Create Content== | ||
<div class='qu'> | <div class='qu'> |
Revision as of 08:55, 7 September 2021
<textarea id='shellbody' data-qtp='DOM' lang=html>
France
<img src='flags/fr.gif'/>
Finland
<img src='flags/fi.gif'/>
</textarea>
Create Content
You can create a div element an set the content.
We use the document method createElement and the DOM node method append
let e = document.createElement('div'); e.innerHTML = 'Hello'; document.body.append(e);
let e = document.createElement('div'); e.innerHTML = 'Hello world'; document.body.append(e);
Create img
You can create a img element an set the src. In this example you must set the src and the style of the new element a.
a.style = 'width:100px;border:solid;';
These are CSS properties.
let a = document.createElement('img'); a.src = '/flags/fr.png'; document.body.append(a);
let a = document.createElement('img'); a.src = '/flags/fr.png'; a.style = 'width:100px;border:solid;'; document.body.append(a);