Maison > Article > interface Web > Comment ajouter du javascript au HTML

Comment ajouter du javascript au HTML

WBOYoriginal: 2023-05-21 09:04:072909parcourir

JavaScript est un langage de script basé sur les objets et basé sur les événements, largement utilisé dans le développement Web. Les pages Web peuvent être rendues plus interactives et dynamiques grâce à JavaScript, et pendant le développement, il est souvent nécessaire d'ajouter du code JavaScript au HTML pour réaliser les fonctions de la page.

Cet article expliquera comment ajouter du JavaScript au HTML, y compris les scripts internes, les scripts externes et les scripts en ligne.

1. Script interne

Le script interne consiste à écrire du code JavaScript directement dans la page HTML. Cette méthode convient aux situations où la quantité de code est faible, comme certains effets interactifs simples. Voici un exemple d'utilisation d'un script interne pour changer la couleur du texte lorsque la souris est placée dessus :

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>内部脚本示例</title>
</head>

<body>
    <h1 onmouseover="this.style.color='red'" onmouseout="this.style.color='black'">鼠标放上去改变颜色</h1>
</body>

</html>

Dans cet exemple, le code JavaScript est directement ajouté à l'élément HTML h1 via les événements onmouseover et onmouseout, de sorte que la couleur du texte change lorsque la souris est placée et éloignée, elle devient respectivement rouge et noire.

2. Script externe

Le script externe stocke le code JavaScript dans un fichier séparé puis l'introduit via la page HTML. Cette méthode convient aux situations où la quantité de code est importante ou où plusieurs pages doivent être partagées, et peut améliorer la maintenabilité et la réutilisation du code. Voici un exemple d'introduction d'un fichier JavaScript externe dans une page HTML :

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>外部脚本示例</title>
    <script src="example.js"></script>
</head>

<body>
    <h1>Hello World!</h1>
</body>

</html>

Dans cet exemple, le chemin d'accès à un fichier JavaScript externe est spécifié via l'attribut 3f1c4e4b6b16bbbd69b2ee476dc4f83a标签的src, puis le code JavaScript du fichier est introduit dans le HTML. fichier, réalisant ainsi la réutilisation du code .

3. Script en ligne

Le script en ligne signifie écrire du code JavaScript dans les attributs des balises HTML. Cette méthode convient aux situations où certains effets interactifs spécifiques doivent être implémentés à l'aide de JavaScript et ne fonctionnent que dans cette balise. Voici un exemple d'utilisation d'un script en ligne pour afficher une boîte de dialogue lorsque vous cliquez sur un bouton :

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>行内脚本示例</title>
</head>

<body>
    <button onclick="alert('Hello World!')">点击这里弹出提示框</button>
</body>

</html>

Dans cet exemple, le code JavaScript est directement ajouté à l'élément de bouton HTML via l'événement onclick, de sorte qu'une boîte de dialogue apparaisse. lorsque le bouton est cliqué.

Les trois méthodes ci-dessus peuvent ajouter du code JavaScript au HTML pour obtenir une page Web plus interactive et dynamique. Dans le développement réel, choisissez la méthode correspondante pour ajouter du code JavaScript selon vos besoins et faites attention à la lisibilité, à la maintenabilité et à la réutilisation du code.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

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

Article précédent：css3deleteArticle suivant：css3delete

Articles Liés

Voir plus