JavaScript12 HTML, CSS 및 JavaScript를 사용하여 웹 아날로그 시계를 만드는 방법 HTML, CSS 및 JavaScript를 사용하여 웹 아날로그 시계를 만드는 방법 bing GPT로 생성한 AI코딩 아래는 HTML, CSS 및 JavaScript를 사용하여 아날로그 시계를 만드는 방법입니다. bing GPT로 질문하여 얻은 대답으로 만든 웹 아날로그 시계입니다. HTML, CSS 및 JAVASCRIP를 사용하여 만들어 달라고 했습니다. 위의 코드는 HTML, CSS 및 JavaScript를 사용하여 아날로그 시계를 만드는 방법을 보여줍니다. 이 코드를 사용하여 웹 페이지에 아날로그 시계를 추가할 수 있습니다. 시계의 크기와 색상을 변경하려면 CSS를 수정하십시오. 시계의 시, 분 및 초를 조정하려면 JavaScript를 수정하십시오. 아래는 웹 코딩으로 작업된 아날로그 시계 적용 시.. 프로그래밍/자바스크립트 2023. 11. 24. [자바스크립트] 예외 처리 - try catch finally 문 예외 처리 프로그래밍을 하다 보면 예상치 않은 곳에서 오류가 발생할 때가 있다. 그 오류가 문법적인 오류일 때도 있고, 정상적인 문법인데도 오류가 발생할 때가 있다. 에러 (Error) - 문법적 오류일 때 발생하는 오류. try{}catch{} 문으로 해결할 수 없는 오류. 예외 (Exception) - 정상적인 문법인데 프로그램 실행 중 발생하는 오류. try{}catch{} 문으로 해결할 수 있는 오류. 예외 처리 방법 프로그램에서 예외가 발생하면 프로그램이 멈춰버리는 상황이 발생한다. 그래서, 프로그램에서 예외 발생시 이를 처리하기 위해 try{}catch{}finally문을 사용한다. 1. try{}문 : 예외가 발생될거라는 의심가는 부분에 try{}문으로 감싸고, 2. catch{}문 : 그 .. 프로그래밍/자바스크립트 2017. 8. 30. [자바스크립트] window.moveBy() window.moveTo() - window 이동하기 윈도우 이동 - window.moveTo(x, y) | window.moveBy(x, y) window객체의 멤버 메소드(moveTo(), moveBy())로 윈도우를 이동 시킨다. window.moveTo(x1, y1) : 윈도우를 화면 (x1, y1) 에 위치시킨다. window.moveBy(x2, y2) : 윈도우를 화면 현 위치에서 (x2, y2) 만큼 이동시킨다. 사용 예 [script] // 윈도우 객체를 생성한다. var childWindow = window.open('','','width=200px, height=200px'); childWindow.document.write('window move'); // 윈도우 시작 좌표 - 단위 px childWindow.moveTo(100, 100.. 프로그래밍/자바스크립트 2017. 8. 28. [자바스크립트] Date 객체 및 D-day(디데이 날짜 및 시간 계산 Date 객체 날짜 및 시간을 구하는 객체 Date 객체 생성 new Date() : 현재 날짜 및 현재 시간를 가진 객체 생성 new Date(년, 월 - 1, 일, 시, 분, 초, 밀리 초) : 매개변수 값으로 날짜를 가진 객체가 생성된다. 월 계산시 (-1)을 주의 사용 예 // 현재 날짜 구하기 var now = new Date(); // 날짜 객체 생성하기 var newDay = new Date(2020, 7, 1, 10, 20, 30, 40); document.write("now : " + now); document.write(" "); document.write(" "); document.write("newDay : " + newDay); document.write(" "); 결과값 Date.. 프로그래밍/자바스크립트 2017. 8. 27. [자바스크립트] 문서 객체 동적 생성 - createElement(), createTextNode(), appendChild(), innerHTML() 문서 객체 동적 생성 문서 객체 동적 생성(1) HTML 에 정의 되어 있지 않은 요소 노드와 텍스트 노드를 동적 생성한다. 아래에서 요소 노드와 텍스트 노드에 대해 알아본다. 본문 내용 동적 생성하기 html, head, title, body 와 같은 태그를 요소 노드라 한다 태그 사이에 '문서 객체 동적 생성' 또는 태그 사이에 있는 '본문 내용 동적 생성하기' 를 텍스트 노드라 한다. 문서 객체를 동적 생성을 위해 아래를 참고한다. 요소 노드 생성 : createElement(tag) - html 태그를 매개변수로 넘긴다. 텍스트 노드 생성 : createTextNode(text) - html 태그 사이에 넣을 텍스트를 매개변수로 넘긴다. html에 연동 하기 appendChild(노드) : 위에서.. 프로그래밍/자바스크립트 2017. 8. 25. [자바스크립트] window.resizeTo(), window.resizeBy() - 윈도우 크기 변경 윈도우 크기 - window.resizeTo(x, y) | window.resizeBy(x, y) window객체의 멤버 메소드(resizeTo(), resizeBy())로 윈도우 크기를 변화 시킨다. window.resizeTo(x1, y1) : 윈도우를 화면 (x1, y1) 의 크기를 가진다. window.resizeBy(x2, y2) : 윈도우를 화면을 현 크기에서 (x2, y2) 만큼 증가시킨다. 사용 예 [script] // 윈도우 객체를 생성한다. var childWindow = window.open('','','width=200px, height=200px'); childWindow.document.write('window resize'); // 윈도우 시작 크기 - 단위 px childWi.. 프로그래밍/자바스크립트 2017. 8. 24. [자바스크립트] window.open() 속성 및 사용법 window.open() 윈도우 새창을 생성할 때 호출한다. 자식 윈도우로 접근할 수 있다. 새창 (자식)윈도우 생성 window.open([URL], [NAME], [FEATURES], [REPLACE]); [URL] : 새창으로 띄울 웹 페이지 주소 [NAME] : 새창 이름 [FEATURES] : 새창의 옵션(크기, 위치, 메뉴바 등의 옵션 설정) [REPLACE] : 히스토리 리스트 옵션 사용 예 var childWindow01 = window.open('', 'child01', 'top=100px, left=100px, height=500px, width=500px'); childWindow01.document.write('자식창 childWindow01'); childWindow01.docum.. 프로그래밍/자바스크립트 2017. 8. 23. [자바스크립트] Math 객체 메소드 Math 객체 수학계산에 쓰이는 Math객체 Math객체는 생성하지 않고 객체자체를 바로 사용한다. 객체 속성 Math.E : 오일러상수 값 (2.718281828459045) Math.LN10 : 밑수가 10인 사용로그 값 (2.302585092994046) Math.LN2 : 밑수가 2인 자연로그 값 (0.6931471805599453) Math.PI : 원주율 값 (3.141592653589793) Math.SQRT2 : 2의 제곱근값 (1.4142135623730951) Math 객체의 메소드 Math.abs(x) : x의 절대값 리턴 Math.ceil(x) : x보다 크거나 같은 수 중 가장 작은 정수값를 리턴 Math.floor(x) : x보다 작거나 같은 수 중 가장 큰 정수값을 리턴 Mat.. 프로그래밍/자바스크립트 2017. 8. 21. 자바스크립트 내장 함수 내장 함수 자바스크립트에서 기본으로 제공하는 함수를 말한다. 많이 봐왔던 alert()가 대표적인 내장 함수이다. 그 외에 다른 내장 함수를 살펴본다. 입력창 > prompt() // 입력창 // prompt(param1, param2); var result = prompt('알림 메시지', '입력 메시지'); document.write("prompt 입력 결과값: " + result + " "); 타이머 함수 > setTimeout() / clearTimeout() / setInterval() / clearInterval() // 타이머 함수 // 특정 시간에 함수를 실행하는 함수 // setTimeout(함수, 시간/ms) - 일정 시간 후 함수를 한번 실행한다. var timeoutID = setT.. 프로그래밍/자바스크립트 2017. 3. 10. 자바스크립트 반복문 (while문/do while문/for문) //////////////////////////////////////////////////// // while 문 //////////////////////////////////////////////////// 조건식이 true일 동안 '실행 코드;' 부분이 반복 실행된다. 그러므로 조건식이 false가 될 수 있는 조건식이 되어야한다 안그러면 실행 코드가 무한 반복이 되어버리는 상황이 발생한다. while( 조건식 ){ 실행 코드; } // while문 // a는 1씩 증가하며 a가 10이 되는 순간 while문 조건식이 false가되어 while문을 빠져나오게 된다. var a = 0; while( a < 10 ){ document.write("while A 문 반복 [" + a + "]번째 "); a.. 프로그래밍/자바스크립트 2017. 3. 8. 배열 선언/사용/추가/삭제 //////////////////////////////////////////////////// // 배열 선언 방법 //////////////////////////////////////////////////// // 1. 배열 생성자 new Array() 로 생성 방법(1) var arrayAA = new Array(); arrayAA[0] = "11"; arrayAA[1] = "22"; // 2. 배열 생성자 new Array() 로 생성 방법(2) var arrayBB = new Array("aa", "bb"); // 3. 직접 선언 방법 > 이 방법이 가장 일반적으로 사용된다. var arrayCC = ["aa1", "bb2", "cc3"]; ///////////////////////////////.. 프로그래밍/자바스크립트 2017. 3. 7. 자바스크립트(javascript)에서 alert(경고창/메시지박스) 사용 예 자바스크립트(javascript)에서 alert(경고창 또는 메시지박스)의 사용 예를 살펴본다. Line 7, Line 9 결과 Line 15, Line 17 결과 Line 21 결과 Line 26, Line 27 결과 Line 30 결과 Line 33 결과 프로그래밍/자바스크립트 2017. 3. 3. 이전 1 다음 💲 추천 글