Sortie JavaScript

Dans certains cas, vous pourriez avoir besoin de générer des sorties à partir de code JavaScript. Par exemple, vous pourriez vouloir visualiser la valeur d'une variable, ou écrire un message dans la console du navigateur pour aider à déboguer un problème dans le code JavaScript en cours d'exécution, etc.

Dans ce tutoriel, vous apprendrez à générer des sorties en JavaScript.

Méthodes de génération de sortie de JavaScript

JavaScript peut afficher des données de différentes manières :

• Écrire dans un élément HTML en utilisant innerHTML

• Écrire dans le flux du document en utilisant document.write()

• Afficher une boîte de dialogue d'alerte en utilisant window.alert()

• Écrire dans la console du navigateur en utilisant console.log()

Utilisez innerHTML

Vous pouvez utiliser des propriétés de l'élémentinnerHTMLpropriétés pour écrire ou insérer la sortie dans un élément HTML.

Mais avant d'écrire la sortie, nous devons utiliser des méthodes telles quegetElementById()et des méthodes similaires pour sélectionner des éléments.

<p id="msg"></p>
<p id="output"></p>
<script>
document.getElementById("msg").innerHTML = "Bonjour le Monde";
document.getElementById("output").innerHTML =　20　+　30;
</script>

Utiliser innerHTML pour modifier le contenu HTML d'un élément, c'est une méthode courante pour afficher des données dans HTML.

Utilisez document.write()

Vous ne pouvez utiliserdocument.write()La méthode parses le contenu dans le document actuel.

<script>
document.write("Bonjour le monde<br>");
document.write(20　+　30);
</script>

Sidocument.write()Utilisez cette méthode après le chargement de la page, elle remplacera tout le contenu existant du document.

<script>
function myFunc() {
　　　document.write("<p>test document.write().</p>");
}
</script>

Utilisez window.alert()

Vous pouvez également utiliser une boîte de dialogue d'alerte pour afficher des messages ou des données à l'utilisateur.

Utilisezalert()La méthode crée une boîte de dialogue d'alerte.

<button onclick="alert('Hello world');">alert</button>

Utilisez console.log()

Vous pouvez utiliserconsole.log()Les méthodes facilitent l'output des messages ou l'écriture des données dans la console du navigateur.

Cette console peut être utilisée à des fins de test ou de débogage.

<script>
console.log("Hello world");
console.log(20　+　30);
</script>

Pour accéder à la console du navigateur Web, appuyez d'abord surF12Appuyez sur une touche du clavier pour ouvrir les outils développeurs, puis cliquez sur l'onglet Console.

Vous découvrirez plus d'informations sur le débogage dans la partie suivante de ce tutoriel.