본문 바로가기

Webstoryboy

Category

Explanation

전체 글

 (864)
[Javascript] 중첩 for문 중첩 for문 for문 안에 for문이 있는 형태입니다. 중첩 for문 for(var i=0; i Sample2 중첩 for문을 이용한 구구단 출력하기 예제입니다. 결과 2X1=2 2X2=4 2X3=6 2X4=8 2X5=10 2X6=12 ....... 9X5=45 9X6=54 9X7=63 9X8=72 9X9=81 html Sample3 중첩 for문을 이용한 테이블 만들기 예제입니다. 결과 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939..
[Javascript] for문 for문 for문은 특정 구문을 여러번 반복하고 싶을 때 사용하는 반복문입니다. for문 for(초깃값; 조건식; 증감값){ //반복 코드 } for(var i=0; i
[Javascript] do while문 do while문 while 문의 경우에는 조건식의 만족 여부를 먼저 검사한 후, 중괄호에 있는 실행문의 실행 여부를 결정합니다. 하지만 do while문은 반드시 한 번은 실행문을 실행하고 조건식을 검사합니다. do while문 while문은 조건을 검사하고 코드를 반복적으로 실행합니다. 첫 조건이 거짓이라면 코드를 실행하지 않을 수 있습니다. 하지만 do while문은 조건이 참, 거짓과 상관없이 최소한 한 번은 실행합니다. var 변수 = 초깃값; do { 실행문; 증감식; } while (조건식) Sample1 do while문을 이용한 예제입니다. html
[Javascript] while문 while문 반복되는 부분을 실행할 때 사용하는 제어문입니다. while문 while문은 조건식에 만족할 때까지 반복적으로 실행하는 반복문입니다. 조건식을 검사하고 만족하면 실행문을 실행하고 증감식을 실행합니다. var 변수 = 초깃값; while (조건식){ 실행문; 증감식; } Sample1 while문을 이용한 예제입니다. html
[Javascript] 조건부 연산자 조건부 연산자 조건부 연산자는 조건을 처리하는 다른 형태의 제어문입니다. 조건부 연산자(삼항 연산자) (조건) ? (참일 때 실행할 코드) : (거짓일 때 실행할 코드); Sample1 if문을 삼항 연산자로 변경하는 예제입니다. html
[Javascript] switch문 switch문 해당 조건에 맞는 값을 case로 구분해서 수행하는 제어문입니다. switch문 var 변수 = 초깃값; switch (조건을 체크할 변수) { csae 값1 : //조건을 체크할 변수가 값1을 가지면 실행 break; csae 값2 : //조건을 체크할 변수가 값2을 가지면 실행 break; csae 값3 : //조건을 체크할 변수가 값3을 가지면 실행 break; default : //해당되는 값을 가지고 있지 않을 경우 실행 break; } Sample1 switch문을 이용한 예제입니다. html Sample2 switch문과 if문을 이용한 학점 예제입니다. html Sample3 switch문을 이용한 사이트 이동 예제입니다. html Sample4 switch문을 if문으로 변..
[Javascript] 다중 if문 다중 if문 여러가지 조건에 따라 조건문을 설정합니다. 조건에 계속 설정할 수 있으며 마지막에는 조건식을 쓰지 않습니다. 다중 if문 if (조건식1) { //참일 때 실행 코드 } else if (조건식2) { //앞 조건이 거짓일 때 실행 코드 } else if (조건식2) { //앞 조건이 거짓일 때 실행 코드 } else if (조건식3) { //앞 조건이 거짓일 때 실행 코드 } else { //앞의 모든 조건이 거짓일 때 실행 코드 } Sample1 다중 if문을 이용한 심리테스트 예제입니다. html Sample2 다중 if문을 예제입니다. html
[Javascript] if~else문 if ~ else문 두개의 값을 비교하여 코드를 별개로 실행합니다. if ~ else문 if ~ else문은 두개의 조건이 있을 때 사용하는 조건문입니다. if (조건식) { //참(true)일 때 실행 코드 } else { //거짓(false)일 때 실행 코드 } Sample1 if문을 이용한 다양한 예제입니다. html
[Javascript] if문 if문 if문 단독으로 사용하는 형태입니다. if문 자바스크립트에서 가장 많이 사용하는 if문입니다. if문은 조건식을 사용할 때 많이 씁니다. if (조건식) { //실행코드 } Sample1 if문을 이용한 다양한 예제입니다. html
[Javascript] 연산자 우선순위 연산자 우선순위 모든 연산자에는 우선순위가 있습니다. 연산자 우선순위 우선순위 연산자 설명 1 괄호/대괄호 ()[] 2 단항 연산자 !, ++, -- 3 곱셈/나눔셈 연산자 *, /, % 4 덧셈/뺄셈 연산자 +, - 5 비교 연산자 >, >=,
[Javascript] 문자열 결합 연산자 문자열 결합 연산자 문자열과 연산자를 결합해서 사용할 수 있습니다. 문자열 결합 연산자 x 변수 y 변수 x + y 숫자 숫자 숫자 문자열 문자열 문자열 숫자 문자열 문자열 문자열 숫자 문자열 Sample1 논리 연산자를 이용한 예제입니다. 결과 number 200 100javascript 100200 101 100 2 1 1 100 string html
[Javascript] 비트 연산자 비트 연산자 비트 연산자는 2진수 형태로 연산을 수행합니다. 비트 연산자 연산자 예시 설명 & x & y x와 y의 비트 단위 AND | x | y x와 y의 비트 단위 OR ^ x ^ y x와 y의 비트 단위 XOR ~ x ~ y x를 비트 단위로 NOT >> x >> 2 x를 2비트만큼 왼쪽으로 이동
[Javascript] 논리 연산자 논리 연산자 참/거짓으로 나타나는 boolean 값을 조합해서 논리 연산을 수행합니다. 논리 연산자 연산자 예시 설명 && X && Y 둘다 true인 경우 true를 반환합니다. || X || Y 둘 중의 하나 이상이 true인 경우 true를 반환합니다. ! !X 반대 값을 반환합니다. Sample1 논리 연산자를 이용한 예제입니다. 결과 false true true false false true false true false false false true html
[Javascript] 비교 연산자 비교 연산자 비교 연산자는 비교 할 때 사용하며, 결과 값은 true(참) 또는 false(거짓)로 반환합니다. 비교 연산자 연산자 예시 설명 == x == y 좌변과 우변이 같다 === x === y 좌변과 우변이 같다. 데이터형도 같다. != x != y 좌변과 우변이 다르다. !== x !== y 좌변과 우변이 다르다. 데이형도 다르다. > x > y 좌변이 우변보다 크다. = x >= y 좌변이 우변보다 크거나 같다.
[Javascript] 증감 연산자 증감 연산자 증가 연산자는 1만큼 증가시키고, 감소 연산자는 1만큼 감소시킵니다. 증감 연산자 연산자 표현 설명 ++ x++ 또는 ++x x = x + 1 -- x-- 또는 --x x = x - 1 Sample1 대입 연산자를 이용한 예제입니다. 결과 9 10 20,21 22,22 html
[Javascript] 대입 연산자 대입 연산자 대입 연산자는 사칙연산을 간결하게 표현할 때 사용합니다. 대입 연산자 연산자 표현 설명 += x += 10 x = x + 10 -= x -= 10 x = x - 10 *= x *= 10 x = x * 10 /= x /= 10 x = x / 10 %= x %= 10 x = x % 10 Sample1 대입 연산자를 이용한 예제입니다. 결과 10 html Sample2 대입 연산자를 이용한 테이블 만들기 예제입니다. 결과 1 2 3 html
[Javascript] 산술 연산자 산술 연산자 산술 연산자는 사칙 연산을 수행합니다. 산술 연산자 연산자 예시 설명 + x + y 더하기 - x - y 뻴셈 * x * y 곱하기 / x / y 나누기 % x % y 나머지 산술 연산자 산술 연산자 예제입니다. 결과 300 -100 20000 0.5 100 html
[Javascript] 변수의 검사 변수의 검사 현재 변수에 어떠한 자료형이 저장되어 있는지 검사합니다. 변수의 검사 현재 변수에 어떠한 자료형이 저장되어 있는지 검사합니다. typeof(검사할 대상) 변수의 검사 현재 변수에 어떠한 자료형이 저장되어 있는지 검사하는 예제입니다. html
[jQuery] .prevAll() .prevAll() 선택한 요소의 이전 요소를 선택합니다. .prevAll() 선택한 요소의 이전 모든 형제 요소를 선택합니다. 문법(Syntax) $("선택자").prevAll(); $("선택자").prevAll("선택자"); 정의(Definition) 선택한 요소의 이전 모든 형제 요소를 선택합니다. 선택한 요소의 이전 모든 형제 요소 중 선택자(태그,아이디,클래스)를 통해 선택합니다. 비교(Compare) .prev() : 선택한 요소의 이전 요소를 선택합니다. .prevAll() : 선택한 요소의 이전 모든 요소를 선택합니다. .prevUntil() : 선택한 요소의 이전에 위치한 요소를 조건에 맞을 때까지 찾습니다. Sample1 선택한 요소의 이전 모든 요소를 선택합니다. 결과 탐색(Trave..
[jQuery] .prev() .prev() 선택한 요소의 이전 요소를 선택합니다. .prev() 선택한 요소의 이전 요소를 선택합니다. 문법(Syntax) $("선택자").prev(); $("선택자").prev("선택자"); 정의(Definition) 선택한 요소의 이전 요소를 선택합니다. 선택한 요소의 이전 요소를 선택자(태그,아이디,클래스)를 통해 선택합니다. 비교(Compare) .prev() : 선택한 요소의 이전 요소를 선택합니다. .prevAll() : 선택한 요소의 이전 모든 요소를 선택합니다. .prevUntil() : 선택한 요소의 이전에 위치한 요소를 조건에 맞을 때까지 찾습니다. Sample1 선택한 요소의 다음 요소를 선택합니다. 결과 탐색(Traversing) .children() 메서드는 선택한 요소의 모든..
[jQuery] .prevAll() .parentUntil() 선택한 요소의 부모 요소 중 조건에 맞을 때까지 찾습니다. .parentUntil() 선택한 요소의 부모 요소 중 조건에 맞을 때까지 찾습니다. 문법(Syntax) $("선택자").parentUntil("선택자"); $("선택자").parentUntil("선택자","조건"); 정의(Definition) 선택한 요소의 모든 부모 요소 중 선택자(태그,아이디,클래스)를 통해 선택합니다. 선택한 요소의 모든 부모 요소 중 선택자(태그,아이디,클래스)와 조건을 통해 선택합니다. 비교(Compare) .parent() : 선택한 요소의 부모 요소만 선택합니다. .parents() : 선택한 요소의 모든 부모 요소를 선택합니다. .parentUntil() : 선택한 요소의 부모 요소 중 ..
[jQuery] .parents() .parents() 선택한 요소의 모든 부모 요소를 선택합니다. .parents() 선택한 요소의 모든 부모 요소를 선택합니다. 문법(Syntax) $("선택자").parents(); $("선택자").parents("선택자"); 정의(Definition) 선택한 요소의 모든 부모 요소를 선택합니다. 선택한 요소의 모든 부모 요소를 선택자(태그,아이디,클래스)를 통해 선택합니다. 비교(Compare) .parent() : 선택한 요소의 부모 요소만 선택합니다. .parents() : 선택한 요소의 모든 부모 요소를 선택합니다. .parentUntil() : 선택한 요소의 부모 요소 중 조건에 맞을 때까지 찾습니다. Sample1 선택한 요소의 모든 부모를 선택합니다. 결과 탐색(Traversing) .ch..
[jQuery] .parent() .parent() 선택한 요소의 부모 요소를 선택합니다. .parent() 선택한 요소의 부모 요소를 선택합니다. 문법(Syntax) $("선택자").parent(); $("선택자").parent("선택자"); 정의(Definition) 선택한 요소의 부모 요소를 선택합니다. 선택한 요소의 부모 요소를 선택자(태그,아이디,클래스)를 통해 선택합니다. 비교(Compare) .parent() : 선택한 요소의 부모 요소만 선택합니다. .parents() : 선택한 요소의 모든 부모 요소를 선택합니다. .parentUntil() : 선택한 요소의 부모 요소 중 조건에 맞을 때까지 찾습니다. Sample1 선택한 요소의 부모 요소 하나만 선택합니다. 결과 탐색(Traversing) .children() 메서드는..
[jQuery] .nextUntil() .nextUntil() 선택한 요소의 다음에 위치한 요소를 조건에 맞을 때까지 찾습니다. .nextUntil() 선택한 요소의 다음에 위치한 요소를 조건에 맞을 때까지 찾습니다. 문법(Syntax) $("선택자").nextUntil(); $("선택자").nextUntil("선택자"); $("선택자").nextUntil("선택자","조건"); 정의(Definition) 선택한 요소의 다음 형제 요소를 선택합니다. 선택한 요소의 다음 형제 요소 중 선택자(태그,아이디,클래스)를 통해 선택합니다. 선택한 요소의 다음 형제 요소 중 선택자부터 조건까지 선택합니다. 비교(Compare) .next() : 선택한 요소의 다음 형제 요소를 선택합니다. .nextAll() : 선택한 요소의 다음 모든 형제 요소를 선택..
[jQuery] .nextAll() .nextAll() 선택한 요소의 다음 모든 형제 요소를 선택합니다. .nextAll() 선택한 요소의 다음 모든 형제 요소를 선택합니다. 문법(Syntax) $("선택자").nextAll(); $("선택자").nextAll("선택자"); 정의(Definition) 선택한 요소의 다음 모든 형제 요소를 선택합니다. 선택한 요소의 다음 모든 형제 요소 중 선택자(태그,아이디,클래스)를 통해 선택합니다. 비교(Compare) .next() : 선택한 요소의 다음 형제 요소를 선택합니다. .nextAll() : 선택한 요소의 다음 모든 형제 요소를 선택합니다. .nextUntil() : 선택한 요소의 다음에 위치한 요소를 조건에 맞을 때까지 찾습니다. Sample1 선택한 요소의 다음 요소를 선택합니다. 결과..
[jQuery] .next() .next() 선택한 요소의 다음 요소를 선택합니다. .next() 선택한 요소의 다음 요소를 선택합니다. 문법(Syntax) $("선택자").next(); $("선택자").next("선택자"); 정의(Definition) 선택한 요소의 다음 요소를 선택합니다. 선택한 요소의 다음 요소를 선택자(태그, 아이디, 클래스)를 통해 선택합니다. 비교(Compare) .next() : 선택한 요소의 다음 요소를 선택합니다. .nextAll() : 선택한 요소의 다음 모든 요소를 선택합니다. .nextUntil() : 선택한 요소의 다음에 위치한 요소를 조건에 맞을 때까지 찾습니다. Sample1 선택한 요소의 다음 요소를 선택합니다. 결과 탐색(Traversing) .children() 메서드는 선택한 요소의 ..
[jQuery] .find() .find() 선택한 요소의 자식 요소 중 조건에 맞는 요소를 선택합니다. .find() 선택한 요소의 자식 요소 중 조건에 맞는 요소를 선택합니다. 문법(Syntax) $("선택자").find("선택자"); $("선택자").find("요소"); 정의(Definition) .find("선택자") : 선택한 요소의 자식 요소 중 선택자를 통해 선택합니다. .find("요소") : 선택한 요소의 자식 요소 중 요소를 통해 선택합니다. 비교(Compare) .children() : 바로 아래 자식만 선택합니다. .find() : 모든 자식 중에서 선택합니다. Sample1 선택한 요소의 자식 요소를 선택합니다. 태그를 통하여 원하는 요소를 선택할 수 있습니다. 결과 탐색(Traversing) .children..
[jQuery] .closest() .closest() 선택한 요소를 포함하면서 가장 가까운 상위 요소를 선택합니다. .closest() 선택한 요소를 포함하면서 가장 가까운 상위 요소를 선택합니다. 문법(Syntax) $("선택자").closest("선택자"); $("선택자").closest("변수"); 정의(Definition) 선택한 요소 중 가장 가까운 상위 요소 선택자(태그,아이디,클래스)를 통해 선택합니다. 선택한 요소 중 가장 가까운 상위 요소 중 변수를 통해 선택합니다. Sample1 선택한 요소 중 가장 가까운 요소를 선택합니다. 결과 탐색(Traversing) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. 첫번째 자식입니다. 첫번째 자식입니다. .closest() 메서드는 선택한 요소의 상위 요소 ..
[jQuery] .children() .children() 선택한 요소의 바로 아래 자식 요소만 선택합니다. .children() 선택한 요소의 바로 아래 자식 요소만 선택합니다. 문법(Syntax) $("선택자").children(); $("선택자").children("선택자"); 정의(Definition) 선택한 요소의 바로 아래 자식 요소만 선택합니다. 선택한 요소의 바로 아래 자식 요소 중 선택자를 통해 선택합니다. Sample1 선택한 요소의 자식 요소를 선택합니다. 여러 요소의 자식이 있어도 첫 번째 자식만 선택합니다. 결과 탐색(Traversing) .children() 메서드는 선택한 요소의 모든 자식을 선택합니다. 첫번째 자식입니다. 첫번째 자식입니다. .closest() 메서드는 선택한 요소의 상위 요소 중 가장 가까운 요..
[jQuery] 기타 기타 탐색과 관련된 기타 메서드입니다. 기타(Miscellaneous Traversing) 메서드 설명 .add() 선택한 요소에 새로운 요소를 추가합니다. .addBack() 선택한 요소의 상위 요소도 같이 선택합니다. .contents() 선택한 요소와 일치하는 콘텐츠 요소를 선택합니다. .each() 선택한 여러 요소들을 각각 순차적으로 실행합니다. .end() 선택한 요소의 필터링이 일어나기 이전의 요소를 선택합니다. Sample : 기타 기본 태그를 선택하는 방법 one1 one2 one3 one4 one5 one6 one7 one8 one9 one10 one10-1 one10-2 one10-1
1 ··· 25 26 27 28 29
Alphabet
Topic
Alphabet
Topic
Alphabet
Topics



Topics
Topics
Topics
Topics
Topics
Topics
Topics
Topics

티스토리툴바