Computer >> 컴퓨터 >  >> 프로그램 작성 >> HTML

HTML DOM li 값 속성

<시간/>

Li 값 속성은

  • 요소의 값 속성 값을 반환/설정합니다.

    구문

    다음은 구문입니다 -

    • 의 반환 값 속성
    liObject.value
    • 의 가치 속성 값 세트
    liObject.value = ‘string’

    Li 값의 예를 살펴보겠습니다. 속성 -

    예시

    <!DOCTYPE html>
    <html>
    <head>
    <title>HTML DOM value</title>
    <style>
       form {
          width:70%;
          margin: 0 auto;
          text-align: center;
       }
       * {
          padding: 2px;
          margin:5px;
       }
       input[type="button"] {
          border-radius: 10px;
       }
       ol{
          width: 30%;
          margin: 0 auto;
       }
    </style>
    </head>
    <body>
    <form>
    <fieldset>
    <legend>HTML-DOM-value</legend>
    <h3>Race Result</h3>
    <ol id="race">
    <li>Alex</li>
    <li>Eden</li>
    <li>Samuel</li>
    <li>Zampa</li>
    </ol>
    <input type="button" onclick="rectifyResult()" value="Alex Cheated">
    <div id="divDisplay"></div>
    </fieldset>
    </form>
    <script>
       var divDisplay = document.getElementById("divDisplay");
       var studentList = document.getElementsByTagName("li");
       var race = document.getElementById("race");
       function rectifyResult() {
          studentList[1].value = '1';
          studentList[2].value = '2';
          studentList[3].value = '3';
          race.removeChild(studentList[0])
          divDisplay.textContent = 'Alex is disqualified';
       }
    </script>
    </body>
    </html>

    출력

    이것은 다음과 같은 출력을 생성합니다 -

    'Alex Cheated'를 클릭하기 전에 버튼 -

    HTML DOM li 값 속성

    '이번 주에 어떤 시험이 있나요?'를 확인한 후 버튼 -

    HTML DOM li 값 속성