Computer >> Máy Tính >  >> Lập trình >> HTML

Thuộc tính tối thiểu của công cụ đo DOM trong HTML

Thuộc tính Meter low trả về / đặt một số tương ứng với thuộc tính min của yếu tố. Sử dụng điều này với các thuộc tính cao, tối đa và thấp để có kết quả tốt hơn.

Cú pháp

Sau đây là cú pháp -

  • Giá trị trả về của min tài sản
meterElementObject.min
  • Giá trị của min bộ tài sản
meterElementObject.min = number

Ví dụ

Hãy để chúng tôi xem một ví dụ cho Mét tối thiểu tài sản -

<!DOCTYPE html>
<html>
<head>
<title>Meter min</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>Meter-min</legend>
<label for="paulaLifeSource">Paula's Health Risk: </label>
<meter id="paulaLifeSource" max="100" min="0" high="80" low="60" value="60" optimum="40"></meter>
<input type="button" onclick="lifeSource()" value="Medi Kit">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   divDisplay.textContent = 'Life Source at '+paulaLifeSource.value+'/'+paulaLifeSource.max;
   function lifeSource(){
      var paulaLifeSource = document.getElementById("paulaLifeSource");
      var Immunity = paulaLifeSource.min;
      paulaLifeSource.min = 20;
      divDisplay.textContent = 'Permenant Damage to '+paulaLifeSource.min+' from '+Immunity;
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Trước khi nhấp vào ‘Bộ công cụ Medi’ nút -

Thuộc tính tối thiểu của công cụ đo DOM trong HTML

Sau khi nhấp vào ‘Medi Kit’ nút -

Thuộc tính tối thiểu của công cụ đo DOM trong HTML