Comment utiliser la balise <code> en HTML ?-tutoriel HTML-php.cn

Comment utiliser la balise en HTML ?

王林

Libérer： 2023-08-22 14:05:07

avant

1455 Les gens l'ont consulté

Comment utiliser la balise <code> en HTML ?

Dans le prochain article, nous apprendrons comment utiliser la balise de sortie en HTML.

L'un des éléments HTML5 est la balise Il fournit un emplacement d'affichage pour les résultats des calculs de script ou de l'interaction de l'utilisateur avec les éléments du formulaire (balises

Grammaire

Voici la syntaxe de la balise

<output>….content…</output>

Copier après la connexion

Utilisez la balise pour les calculs

La traduction est :

Utilisez la balise pour les calculs

Vous devez avoir des connaissances en JavaScript pour utiliser . Pour que le formulaire sache que l'utilisateur saisit un nombre entier, il doit définir Si l'utilisateur fournit des informations supplémentaires, le formulaire renverra NaN, n'indiquant pas un nombre.

Regardons quelques exemples pour comprendre comment utiliser la balise La traduction chinoise de

Exemple 1

est :

Exemple 1

Dans l'exemple ci-dessous, nous créons une tâche de multiplication pour afficher le résultat.

<!DOCTYPE html>
<html>
<body>
   <p>Multiplication:</p>
   <form oninput="a3.value = a1.valueAsNumber * a2.valueAsNumber">
      a1:<input type="number" id="a1"> *
      a2:<input type="number" id="a2"> =
      <output name="a3" for="a1 a2"> </output>
   </form>
</body>
</html>

Copier après la connexion

Lorsque le script s'exécutera, il générera une sortie affichant les champs de saisie a1, a2 pour saisir les valeurs entières afin d'effectuer le calcul que nous avons spécifié dans le script.

Lorsque l'utilisateur essaie de saisir la valeur de a1 et attend la sortie, mais ne saisit pas la valeur de a2, un résultat avec la sortie de "Nan" sera généré sur la page Web.

Exemple 2

Dans l'exemple ci-dessous, nous utilisons la portée de l'élément

<!DOCTYPE html>
<html>
<body>
   <form oninput="a1.value = a2.value">
      <input type="range" id="a2" value="10">
      <br /><br />
      The value is <output name="a1" for="a2">10</output>
   </form>
</body>
</html>

Copier après la connexion

Lorsque le script est exécuté, il génère une sortie affichant un curseur représentant la plage , avec une valeur de paramètre par défaut de "10".

Lorsque l'utilisateur glisse ou essaie de modifier la plage de , la nouvelle valeur de la plage sera affichée sur notre page Web.

Exemple 3

Dans l'exemple ci-dessous, nous créons une tâche d'addition en utilisant type="range" et "number".

<!DOCTYPE html>
<html>
<head>
   <title>HTML Output Tag</title>
</head>
<body>
   <form oninput = "result.value = parseInt(a1.value)+parseInt(a2.value)">
      <input type = "range" name = "a1" value = "0" /> +
      <input type = "number" name = "a2" value = "5" /> <br />
      The output is: <output name = "result"></output>
   </form>
</body>
</html>

Copier après la connexion

Après avoir exécuté le script ci-dessus, la fenêtre de sortie apparaîtra affichant le champ de saisie pour le curseur de plage et le champ de saisie permettant à l'utilisateur de saisir un nombre. Par défaut, sa valeur est fixée à 5.

Lorsque l'utilisateur essaie de glisser et de saisir un entier dans la zone de saisie, la tâche d'ajout sera déclenchée et une nouvelle valeur sera affichée sur la page Web.

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!