Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Thuộc tính optimum của Meter trong HTML DOM


Giới thiệu

Thuộc tính optimum của Meter trong HTML DOM trả về hoặc thiết lập một số tương ứng với thuộc tính optimum của phần tử <meter>. Giá trị này chỉ ra mức "tối ưu" mong muốn của gauge. Nên dùng kết hợp với high, low, min, max.

Lưu ý: Không dùng <meter> làm progress bar, chỉ dùng làm gauge.

Cú pháp

Lấy giá trị optimum:

meterElementObject.optimum

Thiết lập optimum:

meterElementObject.optimum = number

Ví dụ

Ví dụ thay đổi optimum từ 75 lên 85.

<!DOCTYPE html> <html> <head> <title>Meter optimum</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-optimum</legend> 
      <label for="paulaLifeSource">Paula's Health Risk: </label> 
      <meter id="paulaLifeSource" max="100" min="0" high="80" optimum="75" low="70" value="85"> 
      </meter> 
      <input type="button" onclick="lifeSource()" value="Điều chỉnh mức tối ưu"> 
      <div id="divDisplay"></div> 
    </fieldset> 
  </form> 
  <script> 
    var divDisplay = document.getElementById("divDisplay"); 
    divDisplay.textContent = 'Life Source at ' + paulaLifeSource.value; 
    function lifeSource(effect){ 
      var paulaLifeSource = document.getElementById("paulaLifeSource"); 
      var Immunity = paulaLifeSource.optimum; 
      paulaLifeSource.optimum = 85; 
      divDisplay.textContent = 'Optimum level changed to ' + paulaLifeSource.optimum + ' from ' + Immunity; 
    } 
  </script> </body> </html>

Kết quả

Trước khi nhấn Điều chỉnh mức tối ưu:

Thuộc tính optimum của Meter trong HTML DOM

Sau khi nhấn Điều chỉnh mức tối ưu:

Thuộc tính optimum của Meter trong HTML DOM