2023.1~

DOM 실습 코드 HTML 태그 추가하기 appendChild()실행 insertBefore()실행 appendChild()활용 요소이동 부모태그 태그 이동할 요소박스 1. appendChild(node객체) 자식요소들 중에 마지막 위치에 추가 appendChild("\ text\") 불가 var p=document.getElementById("p"); var p=document.createElement("p"); div.appendChild(p); appendChild()실행 버튼 클릭시 txt도 바로 넣어주기 보다는 수정을 위해 따로 변수에 담아둔다 2.insertBefore(새로운 node, 기존 node) 특정 엘리먼트 앞에 추가 function addBefore(){ var fieldset=do..

DOM탐색 어떠한 태그의 상위,하위 태그 사용시 태그간의 관계를 가지고 선택하는 경우 페이지의 크기가 작을 경우 직접적으로 원하는 태그를 선택하지만 커질수록 간접적으로 관계를 가지고 태그를 선택하는 경우가 효율적 객체의 종류 document : 문서에 접근할 때 (문서객체) Element : tag, 요소 등 (태그객체) ->객체생성 (getElement...()이용): 인스턴스화인스턴스 -메모리에 올라가있는 것 var doc =document.getElementByID() doc.title , doc,class, doc.onclick Attribute : 속성 id, class, title, style .. (속성개체) Text : 태그 안의 내용 (텍스트객체) Node : html을 구성하는 모든 요..

window객체 브라우저 안의 모든 요소가 소속된 객체, 최상위이기 때문에 어디서든 접근 가능 브라우저 창을 제어하는 다양한 메서드 제공 open HTML HTML 팝업창 띄우기 팝업창 JavaScript pop ,close 부모창에 있는 것을 자식 창에서 가지고 오고 싶을 때 부모를 가리키는 속성 -> opener : open()를 이용해서 페이지를 열어준 부모페이지를 나타낸다 HTML 팝업창 닫기 JavaScript 기타 참고 onload 페이지 로딩될 때 이벤트 window.onload=()=>{ } onChange select태그와 같이 다른 것을 선택할 때 이벤트 처리를 할 수 있는 메서드 onclick과 같이 마우스 이벤트 처리 onBlur DOM탐색시 클릭했을 때 기능 정의 onclick (..

날짜(date) HTML 오늘 날짜 출력하기 오늘날짜 오늘날짜(표현방식설정) 특정날짜 출력하기 특정날짜 경과날짜구하기 현재날짜: 경과일:일 경과후 날짜: 경과날짜조회 D-Day기능 만들기 현재날짜 수료일: 남은 일수: 확인 JavaScript 오늘날짜 function testDate01(){ //날짜객체 생성 var date=new Date(); var spandate=document.getElementById("today"); // spandate.innerHTML=date.toLocaleString(); } //다른 형태로 출력 function testDate02(){ var date=new Date(); var spandate=document.getElementById("today"); var da..

로또 HTML HTML 로또번호 생성하기 로또 번호 : 보너스 번호 : 생성 JavaScript 1.랜덤함수 function makeBall(){ return Math.floor(Math.random()*45+1); }2.중복제거 function lottoBalls(){ //랜덤담을 배열 생성 var balls=new Array(); var count=0; while(count

함수 선언적 함수 functioin키워드를 사용하여 함수를 정의 function func01(){ console.log("선언적 함수"); func01_2(); } function func01_2(val1,val2){ console.log(val1+val2); } 다른 객체에서 호출이 가능 파라미터의 개수가 달라도 해당 파라미터를 사용하지 않을 경우 정상 작동함 코드의 가독성이 높고 재사용하기 쉬움 익명함수 이름이 없는 함수 함수를 변수에 할당할 때 var add = function(a, b) { return a + b; }; var result = add(2, 3); console.log(result); // 5 다른 함수의 매개변수로 전달 할 때 function calculate(func) { var..