2023. 3. 27. 14:31ㆍ자바스크립트
이 예제에서는 input 요소와 button 요소를 사용하여 메시지 입력란과 전송 버튼을 만들어서
sendMessage() 함수를 호출하여 메시지를 전송합니다.
sendMessage() 함수는 document.getElementById() 메서드를 사용하여 messageInput 요소의 값을
가져와서 콘솔에 출력합니다.
********아래는 코드를 복사해서 사용하면 됩니다.********
<!DOCTYPE html>
<html>
<head>
<title>메시지 입력 예제</title>
</head>
<body>
<input type="text" id="messageInput" placeholder="메시지를 입력하세요.">
<button onclick="sendMessage()">전송</button>
<script>
function sendMessage() {
var message = document.getElementById("messageInput").value;
console.log("메시지 전송: " + message);
}
</script>
</body>
</html>
테스트 결과
alert를 사용하여 메시지 입력된 것을 출력
********아래는 코드를 복사해서 사용하면 됩니다.********
<!DOCTYPE html>
<html>
<head>
<title>메시지 입력 예제</title>
</head>
<body>
<input type="text" id="messageInput" placeholder="메시지를 입력하세요.">
<button onclick="sendMessage()">전송</button>
<script>
function sendMessage() {
var message = document.getElementById("messageInput").value;
alert("메시지 전송: " + message);
}
</script>
</body>
</html>
테스트 결과
'자바스크립트' 카테고리의 다른 글
| #6 자바스크립트 document.getElementById().innerHTML를 이용한 메시지 출력 (1) | 2023.03.30 |
|---|---|
| #5 자바스크립트 document.write 이용한 메시지 출력 (0) | 2023.03.30 |
| #4 자바스크립트 prompt 이용한 입력후 값을 메시지로 반환 (0) | 2023.03.30 |
| #3 자바스크립트 confirm를 이용한 질문형 메시지 (0) | 2023.03.29 |
| #1 자바스크립트를 사용하여 메시지를 출력 (0) | 2023.03.26 |