Difference between revisions of "DOM Creating content"
Jump to navigation
Jump to search
Line 1: | Line 1: | ||
<pre id='shellbody' data-qtp='DOM'></pre> | <pre id='shellbody' data-qtp='DOM'></pre> | ||
== | ==Create Content== | ||
<div class='qu'> | <div class='qu'> | ||
You can create a div element an set the content. | You can create a div element an set the content. | ||
Line 13: | Line 13: | ||
let e = document.createElement('div'); | let e = document.createElement('div'); | ||
e.innerHTML = 'Hello world'; | e.innerHTML = 'Hello world'; | ||
document.body.appendChild(e); | |||
</pre> | |||
</div> | |||
==Create img== | |||
<div class='qu'> | |||
You can create a '''img''' element an set the '''src'''. | |||
We use the document method '''createElement''' and the DOM node method '''appendChild''' and the node property '''innerHTML''' | |||
<pre class='usr'> | |||
let a = document.createElement('img'); | |||
a.src = '/flags/fr.png'; | |||
document.body.appendChild(a); | |||
</pre> | |||
<pre class='ans'> | |||
let a = document.createElement('img'); | |||
a.src = '/flags/fr.png'; | |||
document.body.appendChild(a); | |||
let e = document.createElement('div'); | |||
e.innerHTML = 'France'; | |||
document.body.appendChild(e); | document.body.appendChild(e); | ||
</pre> | </pre> | ||
</div> | </div> |
Revision as of 21:47, 10 August 2021
Create Content
You can create a div element an set the content.
We use the document method createElement and the DOM node method appendChild
let e = document.createElement('div'); e.innerHTML = 'Hello'; document.body.appendChild(e);
let e = document.createElement('div'); e.innerHTML = 'Hello world'; document.body.appendChild(e);
Create img
You can create a img element an set the src.
We use the document method createElement and the DOM node method appendChild and the node property innerHTML
let a = document.createElement('img'); a.src = '/flags/fr.png'; document.body.appendChild(a);
let a = document.createElement('img'); a.src = '/flags/fr.png'; document.body.appendChild(a); let e = document.createElement('div'); e.innerHTML = 'France'; document.body.appendChild(e);