recherche

Maison  >  Article  >  interface Web  >  c Comment utiliser javascript

c Comment utiliser javascript

王林
王林original
2023-05-17 16:25:38548parcourir

JavaScript est un langage de programmation couramment utilisé pour ajouter du contenu dynamique et de l'interactivité aux pages Web. Avec HTML et CSS, il constitue l’élément de base des sites Web modernes. Si vous souhaitez ajouter des éléments dynamiques à votre site Web, JavaScript est indispensable. Dans cet article, nous verrons comment utiliser JavaScript.

  1. Intégrer JavaScript

Il existe deux façons d'intégrer du code JavaScript dans HTML. Tout d'abord, vous pouvez placer des balises de script dans votre code HTML entre les balises 93f0f5c25f18dab9d176bd4f6de5d30e Cela signifie que le code sera exécuté une fois lors du chargement de la page. Par exemple : 

<!DOCTYPE html>
<html>
<head>
  <script>
    function displayMessage() {
      alert("Hello, World!");
    }
  </script>
</head>
<body>
  <button onclick="displayMessage()">Click me!</button>
</body>
</html>

Le code ci-dessus définit une fonction appelée displayMessage(), qui affichera une simple boîte d'alerte. La fonction sera appelée lorsque l'utilisateur cliquera sur le bouton.

La deuxième méthode consiste à créer un fichier JavaScript en dehors du document HTML. Cela rend le code plus organisé et plus facile à gérer. Pour utiliser un script externe, définissez l'attribut src dans la balise 3f1c4e4b6b16bbbd69b2ee476dc4f83a sur le chemin d'accès au fichier JavaScript. Par exemple : 

<!DOCTYPE html>
<html>
<head>
  <script src="myscript.js"></script>
</head>
<body>
  <button onclick="displayMessage()">Click me!</button>
</body>
</html>

Dans cet exemple, le code JavaScript se trouve dans un fichier appelé myscript.js.

  1. Variables et types de données

JavaScript prend en charge une variété de types de données, notamment les chaînes, les valeurs numériques, les valeurs booléennes, les objets, les tableaux, les valeurs nulles et les valeurs non définies. Pour déclarer une variable, utilisez le mot-clé var. 

var name = "John";
var age = 30;
var isMale = true;

Dans l'exemple ci-dessus, nous avons défini trois variables pour stocker respectivement des chaînes, des valeurs numériques et des valeurs booléennes. Vous pouvez utiliser l'opérateur typeof pour déterminer le type de données d'une variable. 

alert(typeof name);  // "string"
alert(typeof age);   // "number"
alert(typeof isMale);  // "boolean"
  1. Opérateurs et expressions logiques

JavaScript prend en charge une variété d'opérateurs, notamment les opérateurs arithmétiques, les opérateurs de comparaison et les opérateurs logiques. Dans l'exemple suivant, nous définissons deux variables x et y et démontrons certains opérateurs couramment utilisés. 

var x = 10;
var y = 5;
var z = x + y;  // 加法运算
var w = x - y;  // 减法运算
var q = x * y;  // 乘法运算
var r = x / y;  // 除法运算
var s = x % y;  // 取模运算
var t = x == y;  // 等于运算符（返回false）
var u = x > y;   // 大于运算符（返回true）
var v = (x > y) && (x < 20);  // 逻辑AND运算符（返回true）

Dans le code ci-dessus, nous avons également montré comment utiliser des expressions logiques. L'opérateur AND relie deux expressions et renvoie vrai lorsque les deux expressions sont vraies.

  1. Fonctions

Les fonctions sont l'un des éléments de base de JavaScript. Les fonctions sont des morceaux de code réutilisables qui peuvent être utilisés avec d’autres codes. Pour définir une fonction, utilisez le mot-clé function. 

function addNumbers(x, y) {
  return x + y;
}

Dans cet exemple, nous définissons une fonction appelée addNumbers qui accepte deux paramètres numériques et renvoie leur somme. Pour appeler une fonction, utilisez le nom de la fonction suivi de parenthèses et transmettez tous les arguments requis. 

var sum = addNumbers(5, 10);  // sum等于15
  1. Events

Les événements sont un autre concept important en JavaScript. Les événements sont des actions qui peuvent être déclenchées, comme cliquer sur un bouton ou soumettre un formulaire. Pour gérer un événement, définissez un gestionnaire d'événements, qui est une fonction qui sera appelée lorsque l'événement se produit. 

<button onclick="displayMessage()">Click me!</button>

Dans l'exemple ci-dessus, nous avons défini un bouton et appelé une fonction appelée displayMessage lorsque vous cliquez sur le bouton.

  1. Opérations DOM

Enfin, jetons un coup d'œil aux opérations DOM en JavaScript. DOM (Document Object Model) est l'interface de programmation des pages Web, qui permet à JavaScript d'accéder et de modifier les éléments et attributs des pages Web. Par exemple, pour accéder à un élément, utilisez l'objet document et spécifiez l'ID de l'élément. 

<p id="myParagraph">This is a paragraph.</p>

Dans l'exemple ci-dessus, nous avons défini un élément paragraphe avec l'ID "myParagraph". Voici un exemple de la façon de modifier son contenu à l'aide de JavaScript. 

var paragraph = document.getElementById("myParagraph");
paragraph.innerHTML = "This is a new paragraph.";

Dans le code ci-dessus, nous obtenons l'élément en utilisant la méthode getElementById et définissons son contenu à l'aide de l'attribut innerHTML.

Résumé

JavaScript est un langage de programmation puissant et flexible qui peut être utilisé pour créer des pages Web interactives et dynamiques. Cet article présente les concepts de base de JavaScript, notamment les variables, les types de données, les opérateurs, les fonctions, les événements et les opérations DOM. Vous êtes maintenant prêt à commencer à écrire votre propre code JavaScript !

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：fermeture de la fenêtre contextuelle javascriptArticle suivant：fermeture de la fenêtre contextuelle javascript

Articles Liés

Voir plus