J'essaie un exemple très basique de création d'une div
à l'intérieur d'une div
déjà existante.
Il ne semble pas fonctionner quand j'utilise:
document.getElementbyId('lc').appendChild(element)
mais fonctionne bien quand je fais ceci:
document.body.appendChild(element)
Dois-je ajouter la fonction windows.onload
? Bien que cela ne fonctionne pas, même alors!
Code HTML:
<body>
<input id="filter" type="text" placeholder="Enter your filter text here.." onkeyup = "test()" />
<div id="lc">
</div>
</body>
Code JS:
function test()
{
var element = document.createElement("div");
element.appendChild(document.createTextNode('The man who mistook his wife for a hat'));
document.getElementbyId('lc').appendChild(element);
//document.body.appendChild(element);
}
Votre code fonctionne bien, vous venez de mal saisir cette ligne de code:
document.getElementbyId('lc').appendChild(element);
changez-le avec ceci:
document.getElementById('lc').appendChild(element);
ICI IS MON EXEMPLE:
<html>
<head>
<script>
function test() {
var element = document.createElement("div");
element.appendChild(document.createTextNode('The man who mistook his wife for a hat'));
document.getElementById('lc').appendChild(element);
}
</script>
</head>
<body>
<input id="filter" type="text" placeholder="Enter your filter text here.." onkeyup = "test()" />
<div id="lc" style="background: blue; height: 150px; width: 150px;
}" onclick="test();">
</div>
</body>
</html>
'b' doit être en majuscule dans document.getElementById
code modifié jsfiddle
function test()
{
var element = document.createElement("div");
element.appendChild(document.createTextNode('The man who mistook his wife for a hat'));
document.getElementById('lc').appendChild(element);
//document.body.appendChild(element);
}
Oui, vous devez soit faire ceci onload
ou dans une balise <script>
après la balise </body>
de fermeture, lorsque l'élément lc
est déjà trouvé dans l'arborescence DOM du document.