Sortie JavaScript

JavaScript n'a aucune fonction d'impression ou de sortie.

JavaScript pour afficher les données

JavaScript peut générer des données de différentes manières :

Utilisez window.alert() pour afficher les données. haut Boîte d'avertissement.

Utilisez la méthode document.write() pour écrire du contenu dans un document HTML.

Utilisez innerHTML pour écrire dans des éléments HTML.

Utilisez console.log() pour écrire dans la console du navigateur.

Utilisez window.alert()

Vous pouvez faire apparaître une boîte d'alerte pour afficher les données :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文网（php.cn)</title>
</head>
<body>
<h1>我的第一个页面</h1>
<p>我的第一个段落。</p>
<script>
    window.alert('你好吗');
</script>
</body>
</html>

Exécutez le programme pour l'essayer

Manipulation des éléments HTML

Pour accéder à un élément HTML depuis JavaScript, vous pouvez utiliser la méthode document.getElementById(id).

Veuillez utiliser l'attribut "id" pour identifier les éléments HTML et innerHTML pour obtenir ou insérer le contenu de l'élément :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文网（php.cn）</title>
</head>
<body>
<h1>PHP中文网</h1>
<p id="demo">我的第一个段落。</p>
<script>
    document.getElementById("demo").innerHTML="段落已修改。";
</script>
</body>
</html>

Exécutez le programme pour l'essayer

L'instruction JavaScript ci-dessus (dans la balise < script>) peut être exécuté dans un navigateur Web :

document.getElementById("demo") est un code JavaScript qui utilise l'attribut id pour rechercher un élément HTML.

innerHTML = "Le paragraphe a été modifié." est le code JavaScript utilisé pour modifier le contenu HTML (innerHTML) de l'élément.

Écrire dans un document HTML

Vous pouvez écrire du JavaScript directement dans un document HTML :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>PHP中文网（php.cn）</title>
</head>
<body>
<h1>我的第一个 Web 页面</h1>
<p>我的第一个段落。</p>
<script>
    document.write(Date());
</script>
</body>
</html>

Exécutez le programme pour l'essayer out

Remarque : veuillez utiliser document.write() pour écrire uniquement le contenu dans la sortie du document. Si document.write est exécuté une fois le chargement du document terminé, la page HTML entière sera écrasée. Comme ce qui suit

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>PHP中文网(php.cn)</title> 
</head>
<body>
<h1>我的第一个 Web 页面</h1>
<p>我的第一个段落。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction() 
{
    document.write(Date());
}
</script>
</body>
</html>

Exécutez le programme et essayez-le

Écrivez sur la console

Si votre navigateur prend en charge le débogage , vous pouvez utiliser la méthode console.log() pour afficher les valeurs JavaScript dans le navigateur.

Utilisez F12 dans le navigateur pour activer le mode débogage, puis cliquez sur le menu "Console" dans la fenêtre de débogage.

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>PHP中文网（php.cn）</title> 
</head>
<body>
<h1>我的第一个 Web 页面</h1>
<p>
浏览器中(Chrome, IE, Firefox) 使用 F12 来启用调试模式， 在调试窗口中点击 "Console" 菜单。
</p>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>

Exécutez le programme et essayez-le

Formation continue

nouveau fichier

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>PHP中文网（php.cn)</title> </head> <body> <h1>我的第一个页面</h1> <p>我的第一个段落。</p> <script> window.alert('你好吗'); </script> </body> </html>

soumettre Réinitialiser le code

Opération automatique

Sortie JavaScript

ÉlémentaireTutoriel de site Web d'imitation d'entreprise Imperial CMS

ÉlémentaireLes débutants sans aucune base dans WordPress créent des blogs personnels et des sites Web d'entreprise

ÉlémentaireVidéo d'instructions sur la création de sites Web à base zéro Ultimate CMS

ÉlémentaireProjet front-end-Shangyou [Pratique complète de la technologie HTML/CSS/JS]

IntermédiaireVue3.0 de 0 pour créer une pratique de projet de système de gestion backend universel

ÉlémentaireCours frontal base zéro [Vue apprentissage avancé et application pratique]

ÉlémentaireTutoriel WEB front-end [HTML5+CSS3+JS]

ÉlémentaireIntroduction rapide à apipost

IntermédiaireTutoriel pratique Vue3+TypeScript au niveau de l'entreprise

ÉlémentaireParlons brièvement de la création d'une entreprise en PHP

IntermédiaireProjet de commerce électronique VUE (combat réel de projet double front-end et back-end)

ÉlémentaireApplication pratique Apipost [api, interface, tests automatisés, mock]