쿵쿵따 만들엇는데 갠찬은가요 ??
305
작성한 질문수 8
샘 직접 만들어 봣습니다 며칠 고민하면서
근데 공지에는 코드전체를 올리지말라햇는데
피드백을 받으려면 올릴수박에 없어서요
만든게 어떤지 평가나 피드백좀주실수잇나여
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
</style>
</head>
<body>
<div><span id="order">1</span>번쨰 쿵쿵따 참가자</div>
<div>제시어:<span id="word"></span></div>
<input type="text">
<button>입력</button>
<script>
const number = Number(prompt('몇명인지 입력을 받는다:'));
const $input = document.querySelector('input'); // 인풋울 자스로 기능을 넣어야 하기떄문이다
const $button = document.querySelector('button'); // 버튼 을 자스기능으로 넣어야 하기떄문
const $order = document.querySelector('#order'); // 몇번쨰인지 자스기능으로 값을 조절해야하기떄문 이다
const $word = document.querySelector('#word'); // 제시어의 저장및 잇는지 확인 하기 위해 자스기능으로 넣어야 하기떄문이다;
let word;
let newWord;
// 인풋에 적혓을떄 세글자인지 판단한다
// 그와반대로 버튼에 눌럿을떄 이벤트가 발생되면
// 제시어값이 잇는채로 버튼이 눌리면 #word와 끝자리가 맞는지도 확인 작업을 해야하고
//
const onClick = () => //버튼을 눌럿을떄
{
if(newWord.length===3) // 버튼을 누르고 세글자 일떄
{
if(!word) // 세글자이면서 제시어가 비어잇다 첫사람이다
{
//제시어를 입력한 상태로 그값을 저장 해주어야 한다
word=newWord;
$word.textContent = word; // word 변수에 담긴 내용이 $word라는 HTML 요소의 텍스트 내용으로 들어가게 될 거예요.
// 그래서 워드 안에 입력된 뉴월드 단어값이 $word. 에 저장이 되서 제시어가 저장이 되는원리이다
$input.value ='';
const order= Number($order.textContent);
if(order + 1 >number) // 세글자이면서 제시어가 비어잇으면서 전체보다 크면
// 크면 1로초기화 시켜야 하고
{
$order.textContent=1;
}
else // 세글자이면서 제시어가 비어잇으면서 전체보다 작으면 ;
{
$order.textContent=order+1;
}
}
else //세글자이면서 제시어가 잇는 즉 이미 한명이 시작한단계
{
if(word[word.length-1]===newWord[0]) // 세글자이면서 제시어가 잇으며 마지막 단어와 시작단어가 같을떄
//둘다 값이 같을떄 제시어를 받는다
{
word=newWord; /// 워드에 인풋 입력값을 저장해놈 단어를 저장 해둠
$word.textContent = word; // 이 해석을 연구해봐야 한다;
$input.value ='';
const order= Number($order.textContent);
if(order + 1 >number) // 세글자이면서 제시어가 비어잇으면서 전체보다 크면
// 크면 1로초기화 시켜야 하고
{
$order.textContent=1;
}
else // 세글자이면서 제시어가 비어잇으면서 전체보다 작으면 ;
{
$order.textContent=order+1;
}
}
else // 자리수 값이 다를떄 올바르지 않는단어임을 알려준다
{
alert('입력을 다시하십시오 올바르지않는단어입니다');
}
}
} // 세글자 일떄 실행
else // 버튼을 눌럿을대 세글자가 아닐떄 들어가지지도 못하게 하면된다
{
alert('세글자가 아니므로 다시 세글자를 입력해주세요');
}
}
const writing =(event) => // 인풋 글자입력란 이벤트 리스너와 연결된 함수
{
newWord= event.target.value; // 인풋의 값이입력되면 저장 할껏 뉴월드에 ;
}
$input.addEventListener('input',writing); // 인푹에 이벤트 발생됫을떄 함수로 연결해서 단어를 저장한다;
$button.addEventListener('click',onClick); // 버튼 이벤트
</script>
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
</style>
</head>
<body>
<div><span id="order">1</span>번쨰 쿵쿵따 참가자</div>
<div>제시어:<span id="word"></span></div>
<input type="text">
<button>입력</button>
<script>
const number = Number(prompt('몇명인지 입력을 받는다:'));
const $input = document.querySelector('input'); // 인풋울 자스로 기능을 넣어야 하기떄문이다
const $button = document.querySelector('button'); // 버튼 을 자스기능으로 넣어야 하기떄문
const $order = document.querySelector('#order'); // 몇번쨰인지 자스기능으로 값을 조절해야하기떄문 이다
const $word = document.querySelector('#word'); // 제시어의 저장및 잇는지 확인 하기 위해 자스기능으로 넣어야 하기떄문이다;
let word;
let newWord;
// 인풋에 적혓을떄 세글자인지 판단한다
// 그와반대로 버튼에 눌럿을떄 이벤트가 발생되면
// 제시어값이 잇는채로 버튼이 눌리면 #word와 끝자리가 맞는지도 확인 작업을 해야하고
//
const onClick = () => //버튼을 눌럿을떄
{
if(newWord.length===3) // 버튼을 누르고 세글자 일떄
{
if(!word) // 세글자이면서 제시어가 비어잇다 첫사람이다
{
//제시어를 입력한 상태로 그값을 저장 해주어야 한다
word=newWord;
$word.textContent = word; // word 변수에 담긴 내용이 $word라는 HTML 요소의 텍스트 내용으로 들어가게 될 거예요.
// 그래서 워드 안에 입력된 뉴월드 단어값이 $word. 에 저장이 되서 제시어가 저장이 되는원리이다
$input.value ='';
const order= Number($order.textContent);
if(order + 1 >number) // 세글자이면서 제시어가 비어잇으면서 전체보다 크면
// 크면 1로초기화 시켜야 하고
{
$order.textContent=1;
}
else // 세글자이면서 제시어가 비어잇으면서 전체보다 작으면 ;
{
$order.textContent=order+1;
}
}
else //세글자이면서 제시어가 잇는 즉 이미 한명이 시작한단계
{
if(word[word.length-1]===newWord[0]) // 세글자이면서 제시어가 잇으며 마지막 단어와 시작단어가 같을떄
//둘다 값이 같을떄 제시어를 받는다
{
word=newWord; /// 워드에 인풋 입력값을 저장해놈 단어를 저장 해둠
$word.textContent = word; // 이 해석을 연구해봐야 한다;
$input.value ='';
const order= Number($order.textContent);
if(order + 1 >number) // 세글자이면서 제시어가 비어잇으면서 전체보다 크면
// 크면 1로초기화 시켜야 하고
{
$order.textContent=1;
}
else // 세글자이면서 제시어가 비어잇으면서 전체보다 작으면 ;
{
$order.textContent=order+1;
}
}
else // 자리수 값이 다를떄 올바르지 않는단어임을 알려준다
{
alert('입력을 다시하십시오 올바르지않는단어입니다');
}
}
} // 세글자 일떄 실행
else // 버튼을 눌럿을대 세글자가 아닐떄 들어가지지도 못하게 하면된다
{
alert('세글자가 아니므로 다시 세글자를 입력해주세요');
}
}
const writing =(event) => // 인풋 글자입력란 이벤트 리스너와 연결된 함수
{
newWord= event.target.value; // 인풋의 값이입력되면 저장 할껏 뉴월드에 ;
}
$input.addEventListener('input',writing); // 인푹에 이벤트 발생됫을떄 함수로 연결해서 단어를 저장한다;
$button.addEventListener('click',onClick); // 버튼 이벤트
</script>
</body>
</html>
답변 1
자바스크립트 입문 강의 재생 안됨
0
76
2
쿵쿵따 조건문 질문입니다.
0
72
2
렛츠가릿 자바스트립트와 공유가 되나요
0
77
1
수강을 하기 전 공부순서에 관한 질문이 있습니다.
1
100
2
안녕하세요
0
101
2
1~45 필터링하는 코드에서 find대신 some써주는게 나을거같습니다.
1
76
2
고차 함수 작성법과 수업 진도 관련한 질문
0
82
3
break와 continue 9:55 내 continue 구문 질문
0
153
2
옵셔널 체이닝 적당한 깊이는 어느 정도인가요?
0
121
2
로또 추첨기 중 입력값을 검사할 때
0
136
2
2-14.else,else if,switch 관련 질문입니다.
0
109
2
가위바위보 이미지(rsp.png)가 안보여요
0
264
3
Math.random() 에 9을 곱하는 이유
0
174
4
클로저 관련해서 질문있습니다.
1
188
2
유튜브 댓글 보고 왔습니다!- 퀴즈 중복된 숫자 검사 for 문
0
246
1
event.target.textContent관련 질문
0
273
2
객체 참조 관련 질문
0
179
1
-2+ -2 = -4 음수 더하기 음수 - 셀프체크 계산기
0
465
1
별찍기 마름모 문제입니다.
0
351
2
숙제 질문
0
217
1
5강 async/await으로 가독성 높이기에서
0
231
1
야구게임 관련 질문입니다
0
186
1
쿵쿵따, 계산기에서 변수 선언
0
181
1
지뢰 힌트 사라짐(대괄호)
0
167
1





