Element / event

728x90

2022 / 8 / 17 수

// 1. 새로운 element를 만들어라.

const h1elem = document.createElement('h1');

// 2. 만든 h1태그에 hello 텍스트를 넣어라 / element를 설정한다.

h1elem.textContent = 'hello world';

// 3. body에 appendChild로 붙여넣어준다.

document.body.appendChild(h1elem);

//-------------------------------------------------------------

// <h1>welcome</h1> 을 없애버리자.

// const target = document.querySelector('h1'); // welcome을 가져옴

// parentNode는 부모객체 removeChild 자식객체를 지워라.

// target.parentNode.removeChild(target);

// 2초후에 welcome을 지워라.

setTimeout(()=>{

const target = document.querySelector('h1');

target.parentNode.removeChild(target);

},2000);

keyup 이벤트 사용방식

// 방법 1 ) body에도 적용시킬 수 있음. (es5 이전 방식)

function OnKeyupProc(event)

{

console.log("키업 메시지가 생겼다!")

};

// 방법 2 ) es6 방식 / ddEventListener로 등록하여 호출

const OnKeyupProc = function(event)

{

console.log("키업 메시지가 생겼다!")

}

// addEventListener 어떤 메시지가 퉁하고 날라오면 이함수를 호출해주세요하는것

document.body.addEventListener('keyup', OnKeyupProc);

// 방법 3 ) es5 시절 방식.

document.body.onkeyup = function(event){

console.log("키업 메시지가 생겼다!")

};

</script>

</body>

티스토리툴바