HTML Tutorial

عنصر <output>

ما هو عنصر <output>؟

هو عنصر HTML يستخدم لإخراج النتائج من الحسابات أو البرامج النصية أو أي محتوى تم إنشاؤه ديناميكيًا.

استخدام عنصر <output>:

  • يتم استخدامه لإخراج النتائج التي لا يتم إنشاؤها عند تحميل الصفحة.
  • يمكّن المستخدمين من رؤية تاريخية للتغييرات في المحتوى.
  • يساعد برامج قراءة الشاشة على فهم العلاقة بين الإدخال والإخراج.

سمات عنصر <output>:

  • for: يحدد عنصر الإدخال المرتبط.
  • name: يحدد اسم النموذج المرتبط.
  • form: يحدد النموذج المرتبط.

أمثلة على عنصر <output>:

<form>
  <input type="number" id="num1" name="num1" value="5">
  <input type="number" id="num2" name="num2" value="10">
  <output id="result" for="num1 num2">15</output>
</form>

<script>
  document.getElementById("num1").addEventListener("input", calculate);
  document.getElementById("num2").addEventListener("input", calculate);

  function calculate() {
    var num1 = parseInt(document.getElementById("num1").value);
    var num2 = parseInt(document.getElementById("num2").value);
    document.getElementById("result").value = num1 + num2;
  }
</script>

استكشاف عنصر <output>:

  1. حدد عنصر الإدخال (<input>) وعنصر الإخراج (<output>).
  2. أضف السمة for إلى عنصر الإخراج، وقم بتعيينه بقيمة معرف عنصر الإدخال.
  3. أضف معالج حدث إلى عنصر الإدخال لتحديث عنصر الإخراج عند تغيير قيمته.