Rendere un componente HTML editabile in Javascript
In Javascript abbiamo la possibilità di rendere un componente HTML editabile.
Per farlo possiamo usare designMode.
Ad esempio, vediamo come farlo su un iframe:
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8">
<title>TEST</title>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<script>
window.onload = function () {
const designed = document.getElementById('designed');
designed.contentDocument.designMode = "on";
}
</script>
</head>
<body>
<iframe id="designed"></iframe>
</body>
</html>
Potete vedere che avete la possibilità di scrivere all'interno del componente.
Ovviamente potete usarlo anche su altri componenti.
La funzione designMode ha solo due opzioni:
- off
- on
Dove off è quella di default.
Enjoy!
javascript html designmode
Commentami!