Maison >interface Web >js tutoriel >Exemple d'insertion de code JavaScript dans HTML_Basics

Exemple d'insertion de code JavaScript dans HTML_Basics

WBOY
WBOYoriginal
2016-05-16 15:56:561111parcourir

Le code JavaScript peut être inclus n'importe où dans un document HTML. Mais il existe les meilleures façons suivantes d’inclure JavaScript dans les fichiers HTML.

  • Dans la section 93f0f5c25f18dab9d176bd4f6de5d30e...9c3bca370b5104690d9ef395f2c5f8d1
  • Dans la section 6c04bd5ca3fcae76e30b72ad730ca86d...36cc49f0c466276486e50c850b7e4956
  • Dans les sections 6c04bd5ca3fcae76e30b72ad730ca86d...36cc49f0c466276486e50c850b7e4956 et 93f0f5c25f18dab9d176bd4f6de5d30e...9c3bca370b5104690d9ef395f2c5f8d1
  • Les scripts et fichiers externes sont ensuite inclus dans la section 93f0f5c25f18dab9d176bd4f6de5d30e... 9c3bca370b5104690d9ef395f2c5f8d1.
  • Dans les sections suivantes, nous verrons comment JavaScript peut être inclus différemment :
  • Dans la section 93f0f5c25f18dab9d176bd4f6de5d30e... 3c7b149cc556f883a18b3c490b028d4e de JavaScript :

Si vous souhaitez exécuter un script sur un événement, lorsque l'utilisateur clique quelque part, par exemple, alors l'en-tête du script devrait ressembler à ceci :

<html>
<head>
<script type="text/javascript">
<!--
function sayHello() {
  alert("Hello World")
}
//-->
</script>
</head>
<body>
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>

Cela produira les résultats suivants :

JavaScript dans la section 6c04bd5ca3fcae76e30b72ad730ca86d... dbf4a1b9d12965251b02d12dd197d73e

Si un script est requis pour le chargement de la page afin qu'il génère le contenu de la page à exécuter, placez le script dans la section 6c04bd5ca3fcae76e30b72ad730ca86d Dans ce cas, il n'est pas nécessaire d'utiliser toutes les fonctionnalités définies par JavaScript :


<html>
<head>
</head>
<body>
<script type="text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<p>This is web page body </p>
</body>
</html>

JavaScript dans les sections 6c04bd5ca3fcae76e30b72ad730ca86d et 93f0f5c25f18dab9d176bd4f6de5d30e
Vous pouvez insérer du code JavaScript dans les sections 93f0f5c25f18dab9d176bd4f6de5d30e et 6c04bd5ca3fcae76e30b72ad730ca86d exactement comme suit :


Dans un fichier externe JavaScript :
<html>
<head>
<script type="text/javascript">
<!--
function sayHello() {
  alert("Hello World")
}
//-->
</script>
</head>
<body>
<script type="text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>

Lorsque vous commencerez à travailler plus intensivement avec JavaScript, vous constaterez peut-être qu'il existe des situations dans lesquelles vous réutilisez le même code JavaScript dans plusieurs pages de votre site.

Vous n'êtes pas limité à conserver le même code dans plusieurs fichiers HTML. La balise script fournit un mécanisme qui permet à JavaScript d'être stocké dans un fichier externe puis inclus dans un fichier HTML.

Voici un exemple pour illustrer comment utiliser les balises de script et l'attribut src pour inclure un fichier JavaScript externe dans le code HTML :

Pour utiliser JavaScript à partir d'une source de fichier externe, vous devez écrire tout le code JavaScript dans un simple fichier texte ".js" en utilisant une extension, puis inclure le fichier comme indiqué ci-dessus.

Par exemple, vous pouvez conserver le contenu de filename.js dans le fichier suivant, puis utiliser la fonction sayHello dans le fichier HTML après avoir inclus le fichier filename.js :
<html>
<head>
<script type="text/javascript" src="filename.js" ></script>
</head>
<body>
.......
</body>
</html>

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn