Comment utiliser le code javascript

Javascript est un langage de programmation largement utilisé qui peut être utilisé dans de nombreux domaines tels que le développement Web, les logiciels de bureau et le développement d'applications mobiles. Cet article explique comment utiliser le code Javascript pour aider les débutants à démarrer rapidement.

1. Créer du code Javascript

Introduire du code Javascript dans des fichiers HTML est le moyen le plus courant. Dans le code HTML, le code Javascript est introduit via la balise <script>, par exemple : </script>

<script>
// 在这里写JavaScript代码
</script>

Vous pouvez également enregistrer le code Javascript dans un fichier .js séparé, puis l'introduire dans le fichier HTML. Par exemple, nous pouvons créer un fichier nommé "script.js" et le référencer dans le fichier HTML :

<script src="script.js"></script>

2. Variables

Les variables sont utilisées pour stocker des données en Javascript. Vous devez utiliser le mot-clé var lors de la création d'une variable, par exemple :

var name = "John";

Le code ci-dessus crée un nom de variable et attribue la chaîne "John" à cette variable. En Javascript, les variables sont typées dynamiquement, c'est-à-dire que le type de la variable peut changer dynamiquement. Par exemple, nous pouvons changer la valeur du nom de la variable ci-dessus en un type numérique :

var name = 10;

Le nom de la variable peut être composé de lettres, de chiffres, de traits de soulignement et de signes dollar, mais il ne peut pas commencer par un chiffre. Les noms de variables sont sensibles à la casse.

3. Types de données

Javascript propose une variété de types de données, notamment des chaînes, des nombres, des tableaux, des objets, etc.

1. String

String est un type de données utilisé pour représenter du texte et peut être placé entre guillemets simples ou doubles. Par exemple :

var name = "John";
var greeting = 'Hello';

2. Numbers

Les nombres sont divisés en types entiers et à virgule flottante en Javascript. Par exemple :

var age = 18;
var price = 9.99;

3. Array

Array est un type de données utilisé pour stocker un ensemble de données. Chaque élément du tableau peut être de n'importe quel type de données. Lors de la déclaration d'un tableau, vous devez utiliser des crochets [] et séparer chaque élément par une virgule. Par exemple :

var fruits = ["apple", "orange", "banana"];

Les éléments du tableau sont accessibles par index et l'index du tableau commence à 0. Par exemple, accédez à « apple » dans le tableau ci-dessus :

var fruit = fruits[0];

4. Object

Les objets sont des types de données utilisés pour décrire des choses dans la réalité. Les objets sont constitués de propriétés et de méthodes. Les propriétés sont les caractéristiques d'un objet et les méthodes sont le comportement de l'objet. Par exemple :

var person = {
  name: "John",
  age: 18,
  sayHello: function() {
    alert("Hello!");
  }
};

Le code ci-dessus crée un objet personne, comprenant le nom, l'âge et une méthode sayHello. Vous pouvez accéder aux propriétés et méthodes d'un objet via des points ou des crochets. Par exemple, accédez au nom dans l'objet personne :

var name = person.name;

4. Flux de contrôle

Le flux de contrôle est un mécanisme permettant de contrôler l'ordre d'exécution du programme. Javascript fournit une variété d'instructions de flux de contrôle.

1. instruction if L'instruction

if est utilisée pour exécuter différents blocs de code en fonction de conditions. Par exemple :

if (age > 18) {
  alert("You are an adult.");
} else {
  alert("You are a child.");
}

Le code ci-dessus détermine si l'âge est supérieur à 18 ans en fonction de la valeur de la variable age et exécute différents blocs de code.

2. boucle for

la boucle for est utilisée pour exécuter le même bloc de code à plusieurs reprises. Par exemple, pour afficher des nombres de 1 à 10 :

for (var i = 1; i <p>Le code ci-dessus utilise la variable i pour boucler de 1 à 10, produisant à chaque fois la valeur i actuelle. </p><ol start="3"><li>boucle while </li></ol><p>la boucle while est utilisée pour exécuter le même bloc de code à plusieurs reprises lorsqu'une condition est vraie. Par exemple, affichez des nombres de 1 à 10 : </p><pre class="brush:php;toolbar:false">var i = 1;
while (i <p>Le code ci-dessus utilise la variable i pour commencer la boucle à partir de 1, afficher la valeur actuelle de i à chaque fois et augmenter i de 1 jusqu'à ce que la boucle se termine lorsque i est supérieur à 10. </p><p>5. Fonction </p><p>Une fonction est un bloc de code qui accomplit une tâche spécifique et peut être appelé à plusieurs reprises pour être exécuté. Les fonctions peuvent être définies en Javascript via le mot-clé function. Par exemple, définissez une fonction qui calcule la somme de deux nombres : </p><pre class="brush:php;toolbar:false">function add(a, b) {
  return a + b;
}

Le code ci-dessus définit une fonction appelée add qui prend deux paramètres a et b et renvoie leur somme.

6.Opération DOM

Javascript peut faire fonctionner l'arborescence DOM (Document Object Model) pour obtenir l'effet de mise à jour dynamique des pages HTML. L'arborescence DOM est une représentation structurée d'une page HTML et chaque élément HTML est un nœud dans l'arborescence DOM. Javascript peut faire fonctionner ces nœuds via l'API DOM, par exemple en modifiant le contenu, les attributs, les styles, etc. des éléments.

1. Get elements

Vous pouvez utiliser getElementById, getElementsByClassName, getElementsByTagName et d'autres méthodes de l'objet document pour obtenir des éléments HTML. Par exemple, obtenez l'élément avec l'identifiant "myDiv":

var myDiv = document.getElementById("myDiv");

2. Modifier le contenu et les attributs de l'élément

Vous pouvez utiliser les attributs innerHTML, innerText et nodeValue du nœud pour modifier le contenu du nœud. Par exemple, pour modifier le contenu de l'élément avec l'identifiant "myDiv" :

var myDiv = document.getElementById("myDiv");
myDiv.innerHTML = "Hello World!";

Vous pouvez utiliser les attributs getAttribute et setAttribute du nœud pour modifier les attributs du nœud. Par exemple, modifiez l'attribut href de l'élément avec l'identifiant "myLink":

var myLink = document.getElementById("myLink");
myLink.setAttribute("href", "http://www.example.com");

3. Modifiez le style de l'élément

Vous pouvez utiliser l'attribut style du nœud pour modifier le style du nœud. Par exemple, modifiez la couleur d'arrière-plan de l'élément avec l'identifiant « myDiv » :

var myDiv = document.getElementById("myDiv");
myDiv.style.backgroundColor = "red";

Ce qui précède sont les opérations de base du code Javascript. Après avoir maîtrisé ces contenus, le champ d'application de Javascript sera encore élargi.

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!