javascript 기초/실습-이벤트, 브라우저 객체모델(BOM),내장객체
이벤트
웹 브라우저나 사용자가 행하는 동작
BODY영역에서 일어남
무언가가 일어 났을때, 어떤 명령이 실행되는것
이벤트 처리기
태그 안에서 이벤트를 처리할 때는 ON+이벤트명
이벤트가 발생했을때, 어떤 함수를 실행할지 알려줌(시작지점을 알려준다고 생각)
종류로는 마우스,키보드,폼,문서 로딩 이벤트가 있고, 마우스와 키보드를 가장 많이 씀
실습 1
1)onclick 클릭하였을 때 이벤트
<button class="over" id="open" onclick
버튼 클릭 시 alert 활성
태그에서 사용할 때는 필요할 떄 바로바로 사용하기 때문에 간편하게 생각 할 수 있다.
하지만 하나의 html파일에 여러가지 언어가 사용되어 복잡해진다. 따라서 유지 보수가 안 좋은 단점이 있다.
2)외부 js파일을 만들고, 버튼 클릭 시 설명 보이기
1. 먼저 html 파일에서 외부 js파일 링크를 걸어 둔다.
<script src="./js/01.js"></script>
2. 다음 js파일에서 보여주는 함수, 숨기는 함수를 만들어 준다. 해당영역의 id를 활용 할 수 도 있음.
css와 같이 .style,.display도 활용 가능
fuction showDetail(){ document.querySelector(#desc').st
document.querySelector('#open').st}
function hideDetail(){
document.querySelector('#desc').st
document.querySelector('#open').st}
3. 해당 버튼에 onclick을 활용하여 연결
<button class="over" id="open" onclick....
<button id="close"자바스크립트", author : "공자"
pages :500, info :function(){ alert(this.title + "책의 분량은"}
학습소감 객체에 대해 정확하게 개념이 잡히지 않아 , 학습하는데 힘이들었다. 연습을 많이해서 내것으로 만들어야겠다.