[Javascript] Li 태그요소를 array (배열)로 넣기

자바스크립트를 만들다 보면 HTML안에있는 Li 또는 Form안의 값을 배열에 넣을 필요가 있다.

이때의 방법은 아래와같습니다.

 

1) 

[넣을 HTML]

<div id="navbar">

    <ul>

        <li id="navbar-One">One</li>

        <li id="navbar-Two">Two</li>

        <li id="navbar-Three">Three</li>

        <li id="navbar-Four">Four</li>

        <li id="navbar-Five">Five</li>

    </ul>

</div>

 

[Javascript 처리 방법]

var lis = document.getElementById("navbar").getElementsByTagName("li");

alert(lis[0].id);

 

각 Li의 값을 변수 lis 에 넣었고, 이것을  alert창으로 띄워 확인하는 것입니다.

 

[처리 결과]

• One
• Two
• Three
• Four
• Five

 

 

두번째로  4개의 라디오 버튼에서 사용자가 무엇을 선택했는지 확인하는 방법입니다.

 

[넣을 HTML]

<h3>question</h3>";

               <input type='radio' name='choices' value = 'A'> "+chA+"<br>

               <input type='radio' name='choices' value = 'B'> "+chB+"<br>

               <input type='radio' name='choices' value = 'C'> "+chC+"<br>

               <input type='radio' name='choices' value = 'D'> "+chD+"<br><br>

                <button class='button' onclick='checkAnswer()'>Submit Answer</button>";

 

[Javascript 처리 방법]

             function checkAnswer() {

                var choices = document.getElementsByName("choices");   

                                   //각각의 choices를 choice변수에 어레이로 저장하고

                for(var i = 0; i < choices.length; i++) {

                    if(choices[i].checked) {

                        alert(choices[i].value);

                        //체크된것이 몇번인지   alert로 확인해 봅니다

}

  }

    }

 

[처리 결과]

• C (사용자가 C를 선택한 경우)