Utilisation de JavaScript


Les scripts en HTML doivent être placés entre les balises <script>

Les scripts peuvent être placés dans les sections <body> et <head>

Balise <script>

Pour insérer du JavaScript dans une page HTML, utilisez la balise <script>

<script> et </script> indiquent à JavaScript où commencer et se terminer. La ligne entre

<script> et </script> contient JavaScript :

<script>
alert("Mon premier JavaScript");
</script>

Vous n'avez pas besoin de comprendre le code ci-dessus. Comprenez simplement que le navigateur interprète et exécute le code JavaScript

lamp那些老旧的实例可能会在  <script> 标签中使用 type="text/javascript"。现在已经不必这样做了。JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言。
entre <script>JavaScript dans


<body>

Dans cet exemple, JavaScript écrit du texte dans le <body> du HTML lorsque la page se charge :

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
	
<p>
JavaScript 能够直接写入 HTML 输出流中：
</p>
<script>
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落。</p>");
</script>
<p>
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
</p>
	
</body>
</html>

Exécuter l'instance»

Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne

Fonctions et événements JavaScript

L'instruction JavaScript dans l'exemple ci-dessus sera exécutée lors du chargement de la page.

Souvent, nous devons exécuter du code lorsqu'un événement se produit, par exemple lorsque l'utilisateur clique sur un bouton.

Si nous mettons le code JavaScript dans une fonction, nous pouvons appeler la fonction lorsque l'événement se produit.

Vous en apprendrez davantage sur les fonctions et les événements JavaScript dans les chapitres suivants.

JavaScript dans <head> ou <body>

Vous pouvez mettre un nombre illimité de scripts dans votre document HTML.

Les scripts peuvent se trouver dans les sections <body> ou <head>, ou les deux.

Une approche courante consiste à placer les fonctions dans la section <head> De cette façon, ils peuvent être placés au même endroit sans interférer avec le contenu de la page. Fonction JavaScript dans

<head>

Dans cet exemple, nous plaçons une fonction JavaScript dans la section <head>

Cette fonction sera appelée lorsque le bouton sera cliqué :

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script>
function myFunction(){
	document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
</head>
<body>
	
<h1>我的 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
	
</body>
</html>

Exécuter l'instance»

Cliquez sur le bouton "Exécuter l'instance" pour afficher l'instance en ligne

<body> Fonction JavaScript dans

Dans cet exemple, nous plaçons une fonction JavaScript dans le Page HTML La partie <corps>

Cette fonction sera appelée lorsque le bouton sera cliqué :

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>
	
<h1>我的第一个 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
<script>
function myFunction(){
	document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
	
</body>
</html>

Exécuter l'instance»

Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne

JavaScript externe

Vous pouvez également enregistrer le script dans un fichier externe. Les fichiers externes contiennent souvent du code utilisé par plusieurs pages Web.

L'extension de fichier des fichiers JavaScript externes est .js.

Si vous devez utiliser un fichier externe, veuillez définir le fichier .js dans l'attribut "src" de la balise <script> :

Exemple

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>
	
<h1>我的 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
<p><b>注释：</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p>
<script src="myScript.js"></script>
	
</body>
</html>

Exécuter l'instance»

Cliquez sur le bouton "Exécuter l'instance" pour afficher l'instance en ligne

Vous pouvez placer le script dans <head> ou <body> et l'effet réel sera exactement le même que si vous aviez écrit le script dans la balise <script>

Le code du fichier myScript.js est le suivant : 

function myFunction()
{
    document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
lamp外部脚本不能包含  <script> 标签。