Back/web9 생코WEB2_js 낮,밤 모드 버튼! 12. 제어할 태그 선택하기 다시 자바스크립트로 복귀해서 진행한다. 우선 night,day 에 해당하는 버튼을 만들고 onclick 속성을 준다. 이제 웹 브라우저에게 body 태그를 선택하도록 해야한다. 그러려면 어떻게 해야할까? 이렇게 body태그를 선택하는 표현을 작성한 후 이제 어떻게 body 태그에 style 속성을 자바스크립트로 넣을 수 있을지 검색해보자. 위의 방법을 참고해서 작성하면 아래와 같다. document.querySelector('body').style로 바꿔주고 그리고 이제 배경색을 블랙으로 주고 싶을 때 자바스크립트에서는 어떻게 쓰는지 찾아본다. 이렇게 하면 night, day 에 따라 배경색과 글자색을 변경할 수 있다. 위의 방법들을 연습하면 사용자와 상호작용해서 html, .. 2023. 3. 4. 생활코딩WEB2_CSS선택자와 우선순위 이 글은 https://opentutorials.org/module/3180/18872생활코딩 이고잉님의 강의를 보고 복습하면서 작성한 글이므로 모든 내용은 아래 opentutorials.org의 내용을 참고하여 작성되었습니다. 웹브라우저 제어 - WEB2 - JavaScript 웹브라우저 제어 2017-12-01 03:34:56 opentutorials.org 8. 웹브라우저 제어 night, day 버튼 클릭시 background-color, color변화시키려면 html은 정적이지만 js로 작성해야 동적으로 작동시킬 수 있다. 9~11. style 속성을 이용해서 CSS 사용하기 는 어떤 의미도 기능도 없지만 css를 통해서 제어하고 싶을 때 사용한다. 화면 전체를 쓰기 때문에 줄바꿈이 된다. 은 .. 2023. 3. 4. 생활코딩WEB2_js 데이터타입, 변수, 대입 연산자 이 글은 https://opentutorials.org/module/3180/18871 생활코딩 이고잉님의 강의를 보고 복습하면서 작성한 글이므로 모든 내용은 아래 opentutorials.org의 내용을 참고하여 작성되었습니다. 변수와 대입 연산자 - WEB2 - JavaScript 변수와 대입 연산자 2017-12-01 03:26:24 opentutorials.org 3. HTML과 JavaScript의 만남 1 (script 태그) 정적인 html과 동적인 javascript의 차이 4. HTML과 JavaScript의 만남 2 (이벤트) onclick 속성은 javascript가 와야한다. onclick 속성값은 웹 브라우저가 기억하고 있다가 이 onclick 속성이 위치하고 있는 태그에 사용자가.. 2023. 3. 4. 2023.02.09_1~8교시 [복습] 앞서 이전 시간에는 ajax를 javascript와 jquery를 이용해서 테스트해봤다. 1. get방식과 post방식의 큰 차이? 2. javascript이용시 1~4개의 순서에 따른 진행순서와 진행 단계별 내용을 아는지? (XML객체 생성/onreadystatechange 속성에 콜백 함수를 지정/open()메소드 호출/send()메소드 호출) 1교시 기존의 form태그로 포스트요청을 하면 기본적으로는 한글이 깨지니까 호스트에서 꺼내기 전에 호출 전에 인코딩을 추가했었다. 그런데 jquery를 이용해서 ajax를 테스트할 때는 요청시 헤더에 charsetUTF-8을 POST에 보내기 때문에 Override아래에 인코딩을 추가하지 않아도 깨지지 않는 것을 확인 가능하다. 따라서 별도의 requ.. 2023. 2. 9. 2023.02.07_EL, 위의 방식이 아닌 방법을 통해 서버 구동시 서블렛이 제대로 작동되지 않아서 원하는 결과가 출력되지 않을 수 있다. servlet을 타고 jsp파일로 넘어오는 것이다. el구문은 영역객체 안에 있는 속성에 접근해서 값을 가져온다. 스크립트릿에 선언된 변수는 가져올 수 없다. 그러므로 page scope에 저장해서 가져와야 브라우저에 출력할 수 있다. pageContext.setAttribute("str1", str1); pageContext를 사용해서 그냥 출력하려면 object 타입은 비교, 더하기 연산이 불가능하다. 따라서 형변환 후 출력해야 한다. 그런데 el구문을 사용하면 자동 형변환되기 때문에 직접 형변환 코드를 사용하지 않고도 결과값을 출력할 수 있다. 4교시 null체크할 때는 두 가지 방법이.. 2023. 2. 7. JSP_20230203_1~4교시 [20230203_1교시] JSP(Java Server Page) 서블릿은 자바 언어로 동적인 페이지를 구현해야 한다. 그와 달리 JSP는 HTML 페이지 안에서 스크립트 형태로 동적인 페이지를 구현한다. Servlet JSP 형태 Java 코드에 HTML 코드 삽입 HTML 코드에 Java 코드 삽입 예시 out.println(""); 특징 비즈니스 로직 처리에 적합 화면 로직 처리에 적합 JSP의 목표는 서블릿의 비즈니스 로직으로부터 화면 로직을 분리하는 것을 목표로 한다. JSP 실행 과정 웹 컨테이너는 클라이언트로부터의 요청이 JSP에 대한 요청일 경우 먼저 JSP 파일을 자바 코드(서블릿)로 변환한다. 변환된 자바 코드(서블릿)를 컴파일하고 서블릿 인스턴스를 생성한다. 서블릿 인스턴스가 생성되면.. 2023. 2. 5. 이전 1 2 다음
