p.112
open()메서드 이용해 팝업창 나타내기
open()메서드를 이용하면 지정한 URL 페이지를 새 브라우저 창에 나타낼수 있다.
즉 이 기능을 이용하면 광고에 자주 사용되는 팝업 창을 만들수 있다.
window.open("http:www.easyspub.com/","esatspub","width=350, height=400, left=50, top=10, scrollbars=no");<body>
<p>
<img src="https://search.pstatic.net/common/?src=http%3A%2F%2Fblogfiles.naver.net%2FMjAyMjA1MDJfMTcg%2FMDAxNjUxNDY3MzY3OTc1.Ehnj00NFL4zTRWMJ8kDFJiIBMFtMWKEXeKRyj0Z7QNIg.ctWIT_TBC3_0-CrpLoUc2p7yi3TiCzIA85rctgW17g4g.JPEG.nall30%2FScreenshot_20220429-163306_Drive.jpg&type=sc960_832" alt="">
<map name="intro" id="intro">
<area shape="rect" coords="230,368,280,390" href="#" alt="창 닫기"
onclick="window.close();">
</map>
</p>
</body>
<script>
window.open("https://developer.mozilla.org/ko/docs/Learn/HTML/Introduction_to_HTML/Getting_started","pop1","width=300,height=400,\left=300,top=50");
</script>
일정한 시간 간격으로 코드 실행하기
1.setIntetval
=일정한 시간 간격으로 코드를 반복 실행
2.setTimeout
=일정한 시간 후에 코드를 실행하고 종료
**이때 시간 간격은 1/1000초 단위(ms)로 작성해야 한다.
즉 3초 간격으로 설정하려면 3,000(3,000 *1/1000)으로 작성해야 한다.
여기서 참조변수는 이 메서드를 제거하는 clearInterval()메서드에서 사용한다.
setInterval()의 기본형
// let 참조변수 = setInterval(function(){코드},시간 간격(ms));
// let 참조변수 = setInterval("코드",시간간격(ms));let addNum = 0;
let auto_1 = setInterval(function(){
addNum++;
console.log("addNum:" + addNum);
// 이 코드는 문자열과 변수를 결합하는 것으로 문자열과 변수를 "+" 기호로
// 이어 붙이는 것이다.
// 문자열과 변수를 이어붙인 문자열을 콘솔에 출력하는 것이다.
// ex) "addNum:5"
},3000);
<body>
<button onclick="clearInterval(auto_1)">증가 정지</button>
<button onclick="clearInterval(auto_2)">감소 정지</button>
</body>
setTimeout() / clearTimeout()
** 응용이 가능하다:setTimeout() 메서드는 일정 시간이 지나면 코드를 실행하고 종료한다.
setTimeout()메서드를 조금만 응용하여 재귀 호출을 하면 setInterval()메서드처럼 사용할 수도 있다.
예제
let PhoneNum = "010-2345-1234"
let result_1 = PhoneNum.substring(0,PhoneNum.length-4)
//PhoneNum의 인덱스 값인(0~PhoneNum)
document.write(result_1,"****<br>");---> 010-2345-****
예제
점심 시간에 "짜장면", "돈가스", "된장국","김치찌개" ,"회덮밥" 중 어떤 메뉴로 선택할지 고민이 된다면 랜덤으로
선택되도록 만들어 보세요
1. 배열 객체를 이용하여 메뉴의 5개 데이터를 변수 menu에 참조시키세요.
2. Math.random()과 배열 데이터 개수(length)를 이용하여 배열 인덱스값이 랜덤으로 나오도록 하세요.
let menu = ["짜장면","돈가스","된장국","김치찌개","회덮밥"];
let menuNum = Math.floor(Math.random() * menu.length);
let slectedMenu = menu[menuNum];
console.log(slectedMenu);
'javascript' 카테고리의 다른 글
| Do it 자바스크립트 + 제이쿼리 입문 5일차 (0) | 2023.04.25 |
|---|---|
| Do it 자바스크립트+제이쿼리 입문 4일차 함수 (0) | 2023.04.20 |
| do it 자바스크립트+제이쿼리 입문 3일차 (0) | 2023.04.14 |
| 웹프로젝트 로그인창완료 (0) | 2023.04.13 |
| do it 자바스크립트+제이쿼리 입문 2일차 (0) | 2023.04.13 |
