Beispiel:JS-Element-outerHTML.html
Aus SELFHTML-Wiki
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css" />
<title>outerHTML</title>
<script>
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('show').addEventListener('click', showHTMLNode);
document.getElementById('button').addEventListener('click', changeHTMLNode);
});
function showHTMLNode() {
let absatz = document.getElementsByTagName('p')[0].outerHTML;
document.getElementById('display').textContent = encodeURI(absatz);
}
function changeHTMLNode() {
var neu = "<p class='absatz'>neuer <strong>starker</strong> Text</p>";
document.getElementById('absatz').outerHTML = neu;
}
</script>
</head>
<body>
<h1>outerHTML</h1>
<main>
<p id="absatz">Ein ganz einfacher Absatz</p>
<p>
HTML-Code
<button id="show">URI-Codieren</button>
<button id="button">Tauschen</button>
</p>
<p>
<label>URI codiert:
<output id="display"></output>
</label>
</p>
</main>
</body>
</html>