En JavaScript, contrairement aux langages tels que Java, il ne dispose d'aucune méthode d'impression ou de sortie. Les quatre méthodes suivantes sont généralement utilisées pour générer des données.
window.alert() pour afficher une boîte d'avertissement.innerHTML pour écrire dans les éléments HTMLdocument.write() document.console.log() pour écrire dans la console du navigateur.Utilisez-les ci-dessous. Montrons un exemple.
crée un nouveau fichier HTML, puis utilise VSCode pour écrire le code suivant.
<!DOCTYPEhtml>
<html>
<tête>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>window.alert()</title>
</tête>
<corps>
<p>Affichage de la fenêtre contextuelle</p>
<script type="text/javascript">
window.alert("Ceci est un test contextuel !");
</script>
</corps>
</html> Ensuite, ouvrez le fichier ci-dessus avec un navigateur. Lors de l'ouverture, la fenêtre contextuelle suivante s'affichera. Après avoir cliqué sur OK, la fenêtre contextuelle se fermera et le contenu sera affiché sur la page Web.
<!DOCTYPE html>
<html>
<tête>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<titre>document.write()</titre>
</tête>
<corps>
<p>Écrire un document HTML</p>
<script type="text/javascript">
document.write(Date());
</script>
</corps>
</html> Après avoir créé un nouveau fichier HTML et écrit le contenu ci-dessus, le navigateur s'ouvre et la page affichera le contenu suivant. Vous pouvez voir que l'écriture de l'heure actuelle à l'aide document.write() est réussie. Cependant, il convient de noter que si document.write() est chargé en même temps qu'un autre contenu et avant que le contenu ne soit chargé, il peut être affiché avec d'autres contenus. Cependant, si document.write() est exécuté après le chargement du contenu de la page, tout le contenu précédemment chargé sera écrasé par le contenu écrit.
<!DOCTYPEhtml>
<html>
<tête>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<titre>document.write()</titre>
</tête>
<corps>
<p>Écrire un document HTML</p>
<button onclick="showDate()">Afficher l'heure</button>
<script type="text/javascript">
fonction showDate() {
document.write(Date());
}
</script>
</corps>
</html> Ce qui suit est une comparaison avant et après l'exécution document.write() après le chargement de la page, indiquant que l'appel document.write() après le chargement de la page écrasera le contenu de la page précédente.
avant et après
JavaScript Si vous souhaitez accéder à un certain élément HTML, vous pouvez utiliser la méthode document.getElementById(id) , puis utiliser innerHTML pour obtenir ou insérer le contenu de l'élément.
<!DOCTYPEhtml>
<html>
<tête>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>innerHTML</title>
</tête>
<corps>
<p id="inner">Manipuler les éléments HTML</p>
<button onclick="changeContext()">Cliquez pour modifier le contenu ci-dessus</button>
<script type="text/javascript">
fonction changeContext() {
document.getElementById("inner").innerHTML = "Contenu modifié";
}
</script>
</corps>
</html> Avant modification Après modification
Pour utiliser console.log() , notre navigateur doit prendre en charge le débogage. Chrome est généralement recommandé. Utilisez ensuite la touche de raccourci F12 pour ouvrir le mode débogage et basculer vers le menu Console dans la fenêtre de débogage. Comme j'utilise Edge ici, la console s'affiche. Ce choix de navigateur repose principalement sur vos propres préférences, mais Chrome est généralement recommandé.
<!DOCTYPEhtml>
<html>
<tête>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<titre>console.log</titre>
</tête>
<corps>
<p>Afficher en mode débogage du navigateur</p>
<script type="text/javascript">
var num1 = 11 ;
var num2 = 10 ;
console.log(num1 + num2);
</script>
</corps>
</html>
, ce qui précède concerne la sortie en JavaScript. Bien qu'il n'existe pas de méthode System.out.println() pour l'impression et la sortie comme Java, les quatre méthodes ci-dessus peuvent essentiellement répondre aux besoins du développement quotidien.