response.sendRedirect() URL이 이동할 페이지로 바뀌어 이동한다. 데이터가 유지되지 않아 공유할 수 없다. 뒤로가기가 가능하다. location.href 자바스크립트. 새로고침이 되지 않고 뒤로가기가 되지 않는다. forward 액션태그 한 프로젝트 안에서 다른 페이지로만 이동이 가능하다. URL 바뀌지 않고, 데이터를 공유하면서 페이지 이동이 가능하다. CSS 선택자 HTML 요소에 클래스를 붙여 만드는 클래스 선택자는 다중 선택이 가능해 여러 효과를 한번에 줄 수도 있다. 부모-자식 선택자를 이용해 특정 부분에만 효과를 주는 것이 가능하다.
선택자 { 속성:속성값; } External CSS - 외부방식 hello.html hello hello.css #hello { color: blue; } 사용하는 데 가장 효율적. CSS 최대 장점! 스타일 소스를 독립된 파일(*. ) 로 만들고 웹문서와 연결시켜 적용한다. 하나의 스타일 파일로 여러 웹문서를 동시에 같은 스타일로 적용하거나 수정이 가능하다. Internal CSS - 내장방식 스타일 소스를 웹문서의 head 영역에 적용한다. 해당 문서에만 적용된다. hello Inline CSS - 인라인 방식 웹문서 body영역의 해당 태그 뒤에 직접 적용한다. hello 소스가 길어지고 통일성이 떨어지며 유지보수에도 불리하다. 가장 추천하지 않는 방식이나, 적용우선순위가 가장 높다. 작업 환경상 ..
form-2 fieldset, leged로 폼 요소를 그룹화 ... 서로 관련있는 폼요소들을 묶어줌 ... 해당 fieldset의 제목, 주제를 나타냄 html5에서 추가된 input값들 html5 추가 input값 1. input type = "time" 시간 (오전/오후 시 분)을 지정하는 요소 2. input type = "date" 날짜 (연도 월 일)을 지정하는 요소 3. input type = "datetime-local" 날짜와 시간 (연 월 일 오전/오후 시 분)을 지정하는 요소 4. input type = "week" 날짜 (연 주)을 지정하는 요소 5. input type = "month" 날짜 (연 월)을 지정..
form-1 form요소의 input값들 input상자의 설명글을 label태그로 표시하고 label에는 for속성의 값을, input에는 id속성의 값을 서로 일치시켜서 설명글과 상자를 연결시킴. minlength="n" / maxlength="n" 속성으로 입력값의 최소/최대 길이를 제한할 수 있다. size="n"속성으로 상자의 길이를 지정 가능. input type = "text" 주관식. 한 줄 글상자 성명 ID 2. input type="password" 주관식. 글상자 주민번호 뒷자리 3. input type="radio" 단일선택형 객관식. 라디오버튼 초기값으로 지정할 항목에는 checked(checked="checked") 추가 단일선택이 하려면 같은 질문하의 항목들끼리 name 속성의 ..
각각의 기능을 실행하면 입력한 메시지가 출력되며 모달 창이 뜬다. 목록1 목록2 목록3 onclick : 클릭 ondbclick : 더블클릭 onmouseover : 마우스오버 onfocus : 텍스트 상자에 포커스 onblur : 텍스트 상자에 포커스 해제(실행된 채 진행이 어려워서 실제로는주석처리하여 사용했다) onkeyup : 키를 눌렀다 놓았을 때 이벤트가 발생 onload : 해당 문서를 불러오면 이벤트가 발생 oncharge : 목록 선택을 변경하였을 때 이벤트가 발생
document.폼이름.input태그이름.blur( ) 함수( ) : input 태그 커서 깜빡임 해제 document.폼이름.input태그이름.select( ) 함수( ) : input 태그 블럭 설정해서 선택 document.폼이름.input태그이름.checked( ) 함수( ) : input 태그 선택 true / 선택해제 false document.폼이름.input태그이름.click( ) 함수( ) : input 태그 알아서 선택 document.폼이름.select태그이름.type 변수 : select 태그 type 저장 document.폼이름.select태그이름.value 변수 : select태그 선택된 value 저장 document.폼이름.select태그이름.selectedIndex 변수 :..
배열 배열은 요소에 접근시 인덱스를 사용하고 객체는 키를 사용 let array = ['사과', '바나나', '포도'] console.log(array); 객체 let product ={ 제품명: '맛있는 건망고', 유형: '당절임', 성분: '망고, 설탕, 어쩌구, 저쩌구', 원산지: '필리핀' }; console.log(product); product['제품명'] product.제품명 console.log(product.성분); let object = { name: '바나나', price: 5000 } console.log(object.name); console.log(object.price); 속성과 메소드 요소 : 배열 내부에 있는 값 하나하나 속성 : 객체 내부에 있는 값 하나하나 메소드 : 객..