비전공자 개발일기

Javascript 본문

Javascript

Javascript

HiroDaegu 2021. 7. 18. 23:08
728x90
SMALL

제목: 끝말잇기 

목표: Javascript 와 html, css를 활용하여 끝말잇기 코드 작성

 

        let body = document.createElement('h1');
        document.body.append(body);
        body.textContent = '끝말잇기';
        
        let firstWord = document.createElement('div');
        firstWord.textContent = '컴퓨터';
        document.body.append(firstWord);
        let form = document.createElement('form');
        document.body.append(form);
        let input = document.createElement('input');
        form.append(input);
        let btn = document.createElement('button');
        btn.textContent = '클릭'
        form.append(btn);
        let result = document.createElement('div');
        document.body.append(result);

        form.addEventListener('submit', function(e) {
            e.preventDefault();
            if (firstWord.textContent[firstWord.textContent.length - 1] == input.value[0]) {
                result.textContent = '딩동댕'
                firstWord.textContent = input.value;
                input.value = '';
                input.focus();
            } else {
                result.textContent = '땡'
                input.value = "";
                input.focus();
            }
        })
728x90
LIST

'Javascript' 카테고리의 다른 글

Javascript - Node.js  (0) 2021.07.29
Javascript  (0) 2021.07.28
Javascript  (0) 2021.07.16
Javascript  (0) 2021.07.15
Javascript  (0) 2021.07.14