본문 바로가기

Frontend/Javascript20

javascript - 문서 객체 모델 style 1. 스타일 설정하기 - style 스타일 주기 스타일 주기 2. html 삽입 - innerHTML html 삽입 버튼을 클릭해주세요. html 삽입 버튼을 클릭해주세요. 실습하기~ 1] 아래의 버튼 클릭시 body의 배경 색상을 검정 또 한번 클릭시 흰색으로 바뀌게 스크립트 코드를 작성하시오. 배경색 변환 배경색 변환 2] 아래의 버튼 클릭시 1~10까지의 행의 값을 가진 테이블을 완성 시키시오. 테이블 생성 버튼을 클릭해 주세요. 테이블 생성 버튼을 클릭해 주세요. 2020. 3. 17.
javascript -document 문서객체 모델 dom : 문서 객체 모델 (document object model) 문서의 정보가 담아져있다. document 라는 변수명으로 문서에 접근 할 수 있다. 1. 객체 검색 메서드 ① 아이디 검색 : getElementById('아이디명'); ② 태그명으로 검색 : document.getElementsByTagName('태그명'); -> 배열로 반환 ③ 클래스명으로 검색 : document.getElementsByClassName('클래스명'); -> 배열로 반환 ④ 속성 name의 값으로 접근 : document.네임명 (name이라는 속성은 form 객체에만 적용) 버튼 안늉 오눌은 워료일 1] 폼 하위 접근하기 document.myForm.myName; // 해당 객체에 커서 이동하기 6] form .. 2020. 3. 16.
java script 반복문 1. while 반복문 : 조건식이 true일때 반복 실행 var num = 0; while(num0){ console.log(num); num --; } 2. 반복문 for : for 안에 초기값, 조건식, 증감식이 포함되어있다. for(초기값 ; 조건식 ; 증감식){ } for(var i=100; i>0;i--){ console.log('반복문 for i 값 출력 ; ', i); } 3. 이중 반복문 for(초기값; 조건식; 증감식){ for(초기값; 조건식 ; 증감식){ } } for(var i=0, i 2020. 3. 9.
java script 연산자 실습 실습1. 자바스크립트 연산자 실습1 2020. 3. 9.
java script 연산자 1. 산술 연산자 : +, -, *, /, % var num1= 15; var num2= 2; console.log('+연산자 :', num1 + num2); console.log('-연산자 :', num1 - num2); console.log('*연산자 :', num1 * num2); console.log('/연산자 :', num1 / num2); console.log('%연산자 :', num1 % num2); 2. 문자열 연산자 var str1 = '한국스마트'; var str2 = "정보교육원"; var num3 = 10; var num4 = '1000'; var result = str1 + str2; console.log('문자열 연산자1 : ', result); console.log('문자열 연.. 2020. 3. 9.
java script 객체 1. 객체(Objcet) ; 객체 = object -자바 스크립트는 객체 기반 언어이다. -객체는 메모리에 올린 데이터이다. 형체가 있는 대상, 메모리에 올라간 데이터 -기본 자료형 혹은 내장 객체(ex.배열)의 값으로 변수 생성 후 데이터 삽입시, 해당 자료형으로 활용할 수 있는 메서드와 속성이 생성된다. -> 염두는 이것을 컨트롤해서 사용만 하면 되는데.... 2. 객체의 요소 - 메서드 (Method) : - 속성 (Property) : 기본형 ① 객체. 메서드( ); ② 객체.속성; ③ 객체.속성 = 값; 3. 개발자가 직접 객체 생성하기 -객체 생성시 객체는 키와 값으로 이루어져있다. -객체의 값은 문자, 숫자, 배열, 객체, 함수 등 모든것을 포함 할 수 있다. 기본형 객체 = { 키 : 값,.. 2020. 3. 9.
728x90
반응형

티스토리툴바