Langauge/JavaScript (23) 썸네일형 리스트형 [JavaScript] 배열(2) - 배열의 메소드 1. 페이지 새로고침(F5) 기능 (2가지 방법) 1. javascript:history.go(0) : 페이지 새로고침(F5) 기능과 동일하다. +1 씩 증가하면 다음페이지, 다다음페이지 ... 이런식으로 이동한다. -1 씩 감소하면 이전페이지, 이이전페이지 ... 이런식으로 이동한다. go(0) = 현재페이지 go(-1) = 이전페이지 go(1) = 다음페이지 2. javascript:location.reload() : 페이지 새로고침(F5) 기능과 동일하다. 처음부터 다시-1 처음부터 다시-2 2. 배열의 메소드 (중요!!) 1-1. 배열명. push() : 배열의 마지막에 새로운 요소를 추가한 후, 변경된 배열의 길이를 반환해준다. const btnLastAdd = document.getElemen.. [JavaScript] 배열(1) - 배열 생성, FOR 문, 반복문으로 사용되는 forEach(), 이벤트 처리 1. 배열 생성하기 배열도 객체이며, 배열을 생성하는 방법은 아래와 같이 2가지가 있다. 1. const arrFruit1 = new Array(); 2. const arrFruit1 = [ ]; const arrFruit1 = []; // 배열도 객체이다. 빈배열을 만들어준다. // 또는 const arrFruit1 = new Array(); // 배열도 객체이다. 빈배열을 만들어준다. 2. HTML 태그 만들기 말 그대로 태그 내 HTML 를 작성하면 된다. 태그 안에 태그가 있는 구조이다. 그것을 변수 html 로 묶어준다. 대괄호 { } 안을 벗어나면 코드는 소멸되기 때문에, 타입은 var, const, let 모두 상관없다. 1. FOR 문 방식 const arrFruit1 = ["사과", "딸.. [JavaScript] 엘리먼트(태그, 요소)를 잡는 6가지 방법 엘리먼트(태그, 요소)를 잡는 6가지 방법 red green blue 버튼1 버튼2 버튼3 버튼4 버튼5 버튼6 게임 영화감상 글쓰기 음악감상 확인 체크박스에 체크된것 알아오기 지우기 체크박스 모두 해제하기 체크박스에 체크가 되어진 값 : 사과 딸기 포도 수박 파스타 모밀 칼국수 비빔냉면 국어 영어 수학 체육 ※ 태그를 노드 라고도 부른다. 배열을 리스트 라고도 부른다. ※ CSS에서 background-color 와 같이 스네이크기법으로 했던것을 자바스크립트에서는 backgroundColor 와 같이 카멜기법으로 바꾸어야만 한다!! 1. 태그를 가지고 선택자를 잡는 방법 document.getElementsByTagName("태그명"); document.getElementsByTagName("태그명").. [JavaScript] Number(숫자 타입) 속성 [ 숫자타입에 사용되는 메소드 ] const num1 = document.getElementById("num1").innerText; // num1 == 20 const num2 = document.getElementById("num2").innerText; // num2 == 30 let result = `${num1+num2}`; // 2030 (string 타입) document.getElementById("num3").innerHTML = result; // 20+30=2030 const num4 = document.getElementById("num4").innerText; // num4 == 20 const num5 = document.getElementById("num5").innerText.. [JavaScript] String 속성 JavaScript string 자바스크립트의 문자열은 '' 또는 "" 모두 동일한 것입니다. 자바스크립트의 문자열 길이는 문자열.length 입니다. 1. 문자열 표시(' ' / " ") 및 길이 1. 자바스크립트의 문자열은 ' ' (홑따옴표) 또는 " " (쌍따옴표) 모두 동일한 것입니다. 무엇을 사용하든 상관없다. 단, ' ' (홑따옴표) 안에는 " " (쌍따옴표) 를 사용한다. " " (쌍따옴표) 안에는 ' ' (홑따옴표) 를 사용한다. ※ 예시 : carName1 = "현대 '제네시스'"; // '제네시스' 를 중간에 강조하고 싶을 경우 carName2 = '기아 "K9"' // "K9" 를 중간에 강조하고 싶을 경우 2. 자바스크립트의 문자열 길이 : 문자열.length (자바와 동일) 문자열.. [JavaScript] object 속성 자바스크립트 object 에 대해서 알아봅니다. 1. 객체생성하기 객체를 생성하는 방법은 아래와 같이 2가지가 있다. const member = new Objcet(); const member = {} 2. 객체 내 함수생성하기 객체 내 함수를 생성하는 방법은 아래와 같이 2가지가 있다. this 는 member의 객체를 의미한다. info1 : function() { return this.id + " " + this.name + " " + this.address; } ECMAScript 6 에서는 속성값이 함수이면 function 키워드 없이 함수명만 적으면 된다. info2() { return this.id + " " + this.name + " " + this.address; } 3. 객체 내 함수.. JavaScript 란? - 주석 및 style 태그, 입력위치 html/css 수업이 벌써 끝나고, javaScript 수업을 시작했다. 매우 중요한 언어라고 하니 열심히 기록해보려고 한다:) JavaScript 란? - 웹을 위한 인터프리터 언어이자 객체기반의 스크립트 프로그래밍 언어 - 웹브라우저 상 다양한 동작을 하도록 기능을 넣어 생동감을 불어넣어주는 역할을 한다. - 컴파일이 필요하지 않다. HTML 웹 페이지에 스크립트를 삽입하기만 하면 동작하며 최신 웹 브라우저에서 모두 동작한다. 1. style 태그 스크립트 태그는 head 태그내에 위치해도 됩니다. 변경전 p태그 클릭하세요 document.getElementById("demo").innerHTML = "p태그의 내용이 변경되었습니다." : 태그 안의 변경전 p태그 의 "변경전 p태그" 자리에 "p태.. 이전 1 2 3 다음
