wkun 님의 블로그

contents 구현시험  -------------------------------------------------------------- 구현시험 UI구현 요구사항문제1. 아래와 같이 폴더 및 파일을 구성하세요. (각 2점 / 총 10점)   요구사항1. 작업영역에 "본인이름"의 폴더 추가하기   요구사항2. 작업영역 폴더 안에 css폴더, js폴더, img폴더 생성하기   요구사항3. html, css, js 각각 지정된 이름으로 별개의 파일로 생성하고 css파일은 css폴더에, js파일은 js폴더에 넣기. (당연히 img파일은 img폴더에 있어야합니다)     - html파일 이름 : index     - css파일 이름 : style.css     - js파일 이름 : 기능과 관련된 직관적인 이름..

CONTENTS 정리html/css/js 기본문법dropdown, slider, tab 기능구현 ------------------------------------------ 정리 html/css/js 기본문법 1. html 문법 : 골격, 배치할 요소 준비  1) 기본 문법        컨텐츠를 작성하면 됩니다.      //위의 구조에서 컨텐츠 있는 부분 제외하고 그 어떤 다른 태그가 작성되면 안됨   //기본 문법은 필수적으로 지켜줘야함     2) 종료태그 없는 예외    : 종료태그 없음    : 종료태그 없음  3) 아이콘 태그 주의사항    텍스트 : 아이콘+텍스트  4) 제일 큰 레이아웃 :                      2. css 문법 : 스타일, 배치  1) 기본 문법   선택자..

CONTENTS 홈페이지 만들기1)dropdown2)slider3)tab ----------------------------------------------------------------- 홈페이지 만들기 예제) body>    header class="header_top">    div id="header_top" class="container">      div>        p>Free shipping for standard order over $100p>      div>      div class="header_right">        div>a href="#">Help & FAQsa>div>        div>a href="#">My Accounta>div>        div>a hre..

CONTENTS 기능구현1)slider2)tab  ---------------------------------------------- 기능구현 1)slider   2)tab

CONTENTS 기능구현1)slider2)tab  ----------------------------------------------------------------  기능구현 1)slider     body>        div id="slidebox">                        ul id="sliders">                li>img src="./img/slide01.jpg" alt>li>                li>img src="./img/slide02.jpg" alt>li>                li>img src="./img/slide03.jpg" alt>li>            ul>                        div id="button..

CONTENTS 랠리테스트(JS DOM)기능구현1)colorflipper2)dropbox3)itemfilter ------------------------------------------------------- 랠리테스트(JS DOM)  문항답변1특정 태그(요소) 하나를 선택하여 변수에 저장하려면 어떻게 해야하나?var 변수명 = document.querySelector(CSS선택자);2특정 태그(요소) 여러개를 선택하여 변수에 저장하려면 어떻게 해야하나?var 변수명 = document.querySelectorAll(CSS선택자);3위에서 선택한 요소의 변수에 이벤트를 연결하려면 어떻게 해야하나?1.요소 한 개 셀렉한 경우변수명.addEventListener("이벤트", 함수명);2.요소 여러 개 셀렉..

CONTENTS JavaScript12.DOM 문서객체6)이벤트7)HTML DOM 요소8)DOM노드 탐색9)HTML 요소(noes) 추가10)HTML 요소(noes) 삭제11)HTML 요소(noes) 변경12)HTMLCollection -------------------------------------------- JavaScript 12.DOM 문서객체 6)이벤트-자바스크립트 사용의 궁극적인 목적은 동적 웹 페이지의 작성임. 따라서 사용자가 웹 페이지의 HTML 요소를 클릭하거나 마우스를 이동하는 등의 경우 이벤트가 발생하며, 이벤트가 발생하면 그에 반응하는 과정을 자바스크립트에 의해 처리할 수 있음-사용자가  HTML 요소를 클릭할 때 코드를 실행하려면 자바스크립트 코드를 HTML 이벤트 속성에 추가..

CONTENTS JavaScript11.BOM 브라우저객체1)BOM(Browser Object Model)2)window 객체3)screen객체4)location객체5)history객체6)navigator객체 X.렌더링 과정 12.DOM 문서객체1)DOM(Document Object Model)2)HTML 요소 선택하기3)HTML 요소 내용 변경하기4)HTML 요소 추가/삭제하기5)HTML 요소 검색하기 연습문제  ------------------------------------------------------------------ JavaScript 11.BOM 브라우저객체 1)BOM(Browser Object Model)-웹 브라우저가 가지고 있는 모든 객체를 의미-최상위 객체는 window 객체임...

CONTENTS JavaScript10.객체8)내장객체(RegExp)랠리 테스트  ---------------------------------------------------------------------  JavaScript 10.객체 8)내장객체(RegExp) RegExp 객체 메서드  script>    let str = "Hello JavaScript";    let regexp_search = str.search(/javascript/i);    document.write(regexp_search + ""); //대소문자 구분x  script> RegExp 객체 메서드(test(), exec(), match())  script>    var str = "Hello JavaScript";    ..

CONTENTS JavaScript10.객체4)내장객체(String)5)내장객체(Date)6)내장객체(Math)7)내장객체(Number)8)내장객체(RegExp) --------------------------------------------------------- JavaScript 10.객체 4)내장객체(String) String메서드  script>    let str01 = "this is JavaScript";    document.write("1. 인덱스가 1인 문자는: " + str01.charAt(1) + "");    document.write("2. 결합된 문자열: " + str01.concat('World...') + "");    document.write("3. 검색된 'Ja'인덱..