content div element. vervangen werkt niet zoals ik wil
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<div id="videoheaderpaul1">
<p>dit is de oude content</p>
</div>
<div style="display:none;" id="nieuwecontent">
<p>nieuwe content</p>
<h1>h1 content</h1>
<h2>h2 content</h2>
</div>
<button onclick = "replaceElement()"> Replace Element </button>
<script>
function replaceElement() {
var newElement = document.createElement('div');
let code = document.getElementById("nieuwecontent").innerHTML;
newElement.textContent = code;
var oldElement = document.getElementById('videoheaderpaul1');
oldElement.replaceWith(newElement);
newElement.setAttribute("id","para-1");
}
</script>
<p>dit is de oude content</p>
</div>
<div style="display:none;" id="nieuwecontent">
<p>nieuwe content</p>
<h1>h1 content</h1>
<h2>h2 content</h2>
</div>
<button onclick = "replaceElement()"> Replace Element </button>
<script>
function replaceElement() {
var newElement = document.createElement('div');
let code = document.getElementById("nieuwecontent").innerHTML;
newElement.textContent = code;
var oldElement = document.getElementById('videoheaderpaul1');
oldElement.replaceWith(newElement);
newElement.setAttribute("id","para-1");
}
</script>
Als ik in de inspector kijk dan ziet de nieuwe content er zo uit:
Code (php)
1
2
3
4
5
2
3
4
5
<div id="para-1">
<p>nieuwe content</p>
<h1>h1 content</h1>
<h2>h2 content</h2>
</div>
<p>nieuwe content</p>
<h1>h1 content</h1>
<h2>h2 content</h2>
</div>
Gewijzigd op 14/02/2024 16:17:13 door Paul Weiss
zou dat niet iets van
newElement.innerHTML = code;
moeten zijn?
https://www.freecodecamp.org/news/innerhtml-vs-innertext-vs-textcontent/#how-to-update-content-with-innerhtml-innertext-and-textcontent
nu wordt er een soort van htmlspecialchars() over je inhoud heen gehaald.