SELF-Treffen in Mannheim 2025
SELFHTML wird 30 Jahre alt! → Veranstaltungs-Ankündigung.
Beispiel:JS-math.cbrt.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" media="screen" href="./Beispiel:SELFHTML-Beispiel-Grundlayout.css">
<style>
math {
font-size: 2em;
}
.visually-hidden {
display: none;
}
</style>
<title>Math.cbrt </title>
<script>
document.addEventListener('DOMContentLoaded', function() {
document.forms.Test.addEventListener('submit', function(submitEvent) {
calculate();
submitEvent.preventDefault();
});
})
function calculate() {
const rad = document.forms.Test.Eingabe.value;
document.querySelector('output').classList.remove('visually-hidden');
document.querySelector('#rad').textContent = rad;
let result = Math.sqrt(rad);
document.querySelector('#result').textContent = result;
}
</script>
</head>
<body>
<h1>Math.cbrt (Kubikwurzel) </h1>
<p>Bitte geben Sie eine Zahl ein und drücken Sie auf den Button.</p>
<form name="Test">
<label for="Eingabe">Radikand</label>
<input type="number" name="Eingabe" id="Eingabe">
<button>∛</button>
</form>
<output class="visually-hidden">
<p><b>Ergebnis</b>:
<p>
<math>
<mroot>
<mn id="rad"></mn>
<mn>3</mn>
</mroot>
<mi>=</mi>
<mn id="result"></mn>
</math>
</output>
</body>
</html>
