如何在HTML中使用<code>標籤？-html教學-PHP中文網

如何在HTML中使用標籤？

王林

發布： 2023-08-22 14:05:07

轉載

1476 人瀏覽過

如何在HTML中使用<code>標籤？

在接下來的文章中，我們將學習如何在HTML中使用output標籤。

HTML5元素之一是標籤。它為腳本計算或使用者與表單元素（

文法

以下是標籤的語法

<output>….content…</output>

登入後複製

使用標籤進行計算

的翻譯為：

使用標籤進行計算

您必須對JavaScript有一定的了解才能使用。為了讓表單知道使用者正在輸入整數，需要定義 type="number"。如果用戶提供了任何其他信息，表單將返回NaN，表示不是一個數字。

讓我們來看一些例子，以了解如何在HTML中使用標籤...

Example 1

的中文翻譯為：

範例1

#在下面的範例中，我們正在建立一個乘法任務來顯示輸出。

<!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>

登入後複製

當腳本執行時，它將產生一個輸出，顯示輸入欄位a1、a2，以輸入整數值，以執行我們在腳本中指定的計算。

當使用者嘗試輸入a1的值並等待輸出，但沒有輸入a2的值時，網頁上會產生一個輸出為"Nan"的結果。

範例2

在下面的範例中，我們使用元素與元素的範圍。

<!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>

登入後複製

當腳本被執行時，它將產生一個輸出，顯示表示範圍的滑桿，其預設值為"10"。

當使用者滑動或嘗試更改的範圍時，範圍的新值將顯示在我們的網頁上。

Example 3

在下面的範例中，我們使用type=”range”和“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>

登入後複製

執行上述腳本後，輸出視窗將彈出，顯示範圍滑桿的輸入欄位以及使用者輸入數字的輸入欄位。預設情況下，其值設定為5。

當使用者嘗試滑動並輸入整數到輸入方塊時，會觸發加法任務並在網頁上顯示新的值。

以上是如何在HTML中使用標籤？的詳細內容。更多資訊請關注PHP中文網其他相關文章！