JavaScript HTML DOM - Modification du HTML
HTML DOM permet à JavaScript de modifier le contenu des éléments HTML.
Modifier le flux de sortie HTML
JavaScript peut créer du contenu HTML dynamique :
La date d'aujourd'hui est : mercredi 26 octobre 2016 10:01:53 GMT+0800 (heure standard de la Chine)
En JavaScript, document.write() peut être utilisé pour écrire du contenu directement dans le flux de sortie HTML.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<script>
document.write(Date());
</script>
</body>
</html>
N'utilisez jamais document.write() une fois le chargement du document terminé. Cela écrasera le document.
Modification du contenu HTML
Le moyen le plus simple de modifier le contenu HTML est d'utiliser l'attribut innerHTML.
Pour modifier le contenu d'un élément HTML, utilisez cette syntaxe :
document.getElementById(id).innerHTML=new HTML
Cet exemple modifie <h1> ; content :
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<body>
<h1 id="header">Old Header</h1>
<script>
var element=document.getElementById("header");
element.innerHTML="新标题";
</script>
</body>
</html> Exemple d'explication :
Le document HTML ci-dessus contient l'élément <h1> avec id="header"
Nous utilisons HTML DOM pour obtenir l'élément id="header "
JavaScript modifie le contenu de cet élément (innerHTML)
modifie les attributs HTML
Pour modifier les attributs des éléments HTML, veuillez utiliser cette syntaxe :
document.getElementById(id).attribute=new attribue value
Cet exemple modifie l'attribut src de l'élément <img> :
Le document HTML ci-dessus contient l'élément <img> avec id="image"
Nous utilisons HTML DOM pour obtenir l'élément avec id="image"
JavaScript Modifiez les attributs de cet élément (remplacez "../style/images/smiley.gif" par "../style/images/landscape.jpg")
section suivante
