티스토리 뷰

LANGUAGE/JAVA SCRIPT

[JAVA SCRIPT] ALERT( )

진심스테이크 2018. 4. 5. 13:37

 

alert 함수를 이용해서 내가 입력한 문장들을 띄우기

 

 

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript">
        function seClick(){
            var textBox = document.getElementById("myName");
                alert(textBox.value);
        }
    </script>
</head>
<body>
    <input type="text" id="myName">
    <input type="button" value="인사하기" onclick="seClick()">
</body>
</html>

 


 

RadioButton을 선택하고, 선택한 내용을 alert에 띄우기

<!DOCTYPE html>
<html>
<head>
    <title>Favorite Sub</title>
    <script type="text/javascript">
        function getChoose(){
            //sub에 대한 배열 만들기
            var objSelect = document.getElementsByName("sub"); 
            //반복문을 통해 i번째 radio를 실행
            for(var i = 0; i<objSelect.length; i++){
                if(objSelect[i].checked){
                    alert(objSelect[i].value);
                    break;
                }
            }
        }
    </script>
</head>
<body>
    <input type="radio" name="sub" value="HTML">HTML<br>
    <input type="radio" name="sub" value="CSS">CSS<br>
    <input type="radio" name="sub" value="JAVA SCRIPT">JAVA SCRIPT<br>
    <input type="button" id="select" value="답안지 제출" onclick="getChoose()">
</body>
</html>

 


 

위에 코드를 tag를 사용해서 바꿔보기

<!DOCTYPE html>
<html>
<head>
    <title>Tag</title>
    <script type="text/javascript">
        function getChoose(){
            var objSelect = document.getElementsByName("sub");
            for(var i = 0; i<objSelect.length; i++){
                if(objSelect[i].type == "radio" && objSelect[i].checked){
                    //라디오이면서 체크된거만 불러오겠다
                    alert(objSelect[i].value);
                    break;
                }
            }
        }
    </script>
</head>
<body>
    <input type="radio" name="sub" value="HTML">HTML<br>
    <input type="radio" name="sub" value="CSS">CSS<br>
    <input type="radio" name="sub" value="JAVA SCRIPT">JAVA SCRIPT<br>
    <input type="button" id="select" value="답안지 제출" onclick="getChoose()">
</body>
</html>

 

 

 

 

 

'LANGUAGE > JAVA SCRIPT' 카테고리의 다른 글

[JAVA SCRIPT] 계산기  (0) 2018.04.05
[JAVA SCRIPT] 배열 관련 객체  (0) 2018.04.05
[JAVA SCRIPT] 배경 색깔 바꾸기  (0) 2018.04.05
[JAVA SCRIPT] String 내장객체  (0) 2018.04.04
[JAVA SCRIPT] 비교 연산자  (0) 2018.04.04
댓글